amp-custom


Optimize CSS source for AMP HTML.

If you are using PostCSS, use postcss-amp-custom.

CLI

Run amp-custom by CLI.

``shell
npx amp-custom input.css output.css
`

API

Install package.

`shell
npm install --save-dev amp-custom
`

Run amp-custom by API.

`js
const AmpCustom = require('amp-custom')
const ampCustom = new AmpCustom()
const cssSource = @charset "UTF-8";
body {
font-size: 16px;
}
@page hoge {
size: portrait;
margin: 15mm;
}
a {
color: #39c !important;
text-decoration: none;
}
@viewport {
min-width: 640px;
max-width: 800px;
}
@supports not (display: flex) {
.flexbox {
overflow: hidden;
}
.flexbox div {
float: left;
}
}

ampCustom.optimize(cssSource) // 'body{font-size:16px}a{color:#39c;text-decoration:none}'
`

$3

Optimize CSS for AMP.

`js
const cssSource = @charset "UTF-8";
body {
font-size: 16px;
}
@page hoge {
size: portrait;
margin: 15mm;
}
a {
color: #39c !important;
text-decoration: none;
}
@viewport {
min-width: 640px;
max-width: 800px;
}
@supports not (display: flex) {
.flexbox {
overflow: hidden;
}
.flexbox div {
float: left;
}
}

ampCustom.optimize(cssSource) // 'body{font-size:16px}a{color:#39c;text-decoration:none}'
`

$3

Check the CSS string size meets the AMP rules (75KB).

`js
const cssSource = 'body{font-size:16px}a{color:#39c;text-decoration:none}'

ampCustom.isOverMaxByte(cssSource) // false
``

License

MIT License.