img2amp-img

img to amp-img

<img src="http://example.com/sample.png" alt="sample image" />

↓

<amp-img
  alt="sample image"
  src="http://example.com/sample.png"
  width="900"
  height="675"
  layout="responsive"
>
</amp-img>

Install

npm install img2amp-img
# or
yarn add img2amp-img

Usage

const img2AmpImg = require('img2amp-img');

(async () => {
  const imageTag = '<img src="<Image URL>" alt="alt text" />';
  const ampImgTag = await img2AmpImg(imageTag);
  console.log(ampImgTag);
})();

Output

<amp-img
  alt="alt text"
  src="<Image URL>"
  width="200" // -> Width of specified image
  height="100" // -> Height of specified image
  layout="responsive" // -> Now it's fixed at responsive
></amp-img>

Option

Can use the options corresponding to the layout attribute.

If no option is specified, responsive will be selected.

'responsive'
'fill'
'fixed'
'fixed-height'
'flex-item'
'intrinsic'
'nodisplay'

For more information about the option, please refer to the official AMP website.

<amp-img> - amp.dev

Licence

MIT

Author

Yuki Shindo