Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

html2amp

Package Overview
Dependencies
Maintainers
1
Versions
20
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

html2amp

Simple converter from HTML into AMP(Accelerated Mobile Pages)

  • 1.0.3
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
63
decreased by-33.68%
Maintainers
1
Weekly downloads
 
Created
Source

html2amp

  • CircleCI
  • node

html2amp is simple converter from HTML into AMP(Accelerated Mobile Pages).

Motivation

This library allow you to convert simple html into AMP. What does the simple mean ? As you know AMP has many restrictions to make it such as ...

  • Some html tags are needed to be replaced by special one (<amp-img />, <amp-iframe />)
  • CSS should be less than 50,000 bytes and it should be as inline

You can see full Specification here. AMP HTML Specification It could be hard to convert any html into AMP perfectly but if it's simple one it's possible to convert automatically.

For example...

  • Tech blog
  • Corporate news blog

So this library's target is To convert simple html into AMP.

Installation

$ npm install html2amp --save

Usage

const html2amp = require('html2amp')
const html = `<your html>`
const options = {}
const amp = html2amp(html, options)

console.log(amp) // amp string

Options

namedefault valuenote
cwd.image / styles base path
gaConfigPathamp-analytics config json path for google analytics
serviceWorkerattributes of amp-install-serviceworker
e.g. src, data-iframe-src

Functions

This library ...

  • add <meta charset="utf-8" /> if it does not exist
  • add amp attribute to the <html>
  • add viewport meta if it does not exist
    • viewport should be <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
  • replace all external css files with one <style amp-custom>/* css is here */<style/>
    • also removed !imporant keyword
  • remove all scripts
  • add AMP CSS boilerplate
  • replace <img />, <picture><source /></picture> with <amp-img />
    • also add width height attributes if it do not exist
    • also add layout="responsive" attribute
  • replace <iframe /> with <amp-iframe />
  • add <amp-analytics />
    • only support google analytics
    • also removed regular google analytics tag
    • it's optional
  • add amp-install-serviceworker
    • it's optional
  • replace all a tag links which destination is original site with absolute url which starts with http[s]
    • original url comes from canonical's href attribute
    • e.g. <a href="/test"> is replaced with <a href="https//original-url.com/test">

Preparation

To make your html valid AMP your html also should ...

  • have canonical meta tag to regular HTML
  • not have any problem if all scripts are removed
  • not have any problem if all !imporant syntax are removed in css

Keywords

FAQs

Package last updated on 04 Aug 2019

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc