postcss-csso-7

PostCSS@7 plugin to minify CSS using CSSO

Usage no npm install needed!

<script type="module">
  import postcssCsso7 from 'https://cdn.skypack.dev/postcss-csso-7';
</script>

README

NPM version Build Status

postcss-csso-7

PostCSS plugin to minify CSS using CSSO (a CSS minifier with structural optimizations).

Under the hood, the plugin converts PostCSS AST into CSSO's AST, optimises it and converts back. The plugin uses input PostCSS's AST nodes (or their clones) on back convertation, so the shape of original PostCSS's nodes persists the same after compression in most cases (e.g. properties added by other plugins isn't lost). This approach makes it possible to achieve a great performance and generate source maps correctly.

The performance of postcss-csso is approximately the same as CSSO has itself (see CSSO numbers in minifiers comparison table).

If you have any difficulties with the output of this plugin, please use the CSSO tracker.

Install

npm install postcss-csso-7

Usage

var postcss = require('postcss');
var csso = require('postcss-csso-7');

postcss([
    csso
])
    .process('.a { color: #FF0000; } .b { color: rgba(255, 0, 0, 1) }')
    .then(function(result) {
        console.log(result.css);
        // .a,.b{color:red}
    });

Plugin takes the same options as compress() method of CSSO with no exception.

postcss([
    csso({ restructure: false })
])
    .process('.a { color: #FF0000; } .b { color: rgba(255, 0, 0, 1) }')
    .then(function(result) {
        console.log(result.css);
        // .a{color:red}.b{color:red}
    });

License

MIT