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>npm install img2amp-img
# or
yarn add img2amp-imgconst 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>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.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent