postcss-discard

PostCSS plugin to discard rules, atrules or declarations by selector, RegExp or callback function

Usage no npm install needed!

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

README

PostCSS Discard Build Status

PostCSS plugin to discard rules by selector, RegExp, or @type. Also usable to generate a diff from two stylesheets

Usage

const discard = require('postcss-discard');
postcss([discard(options)]);

See PostCSS docs for examples for your environment.

Options

Name Type Description
atrule String, RegExp, Function Match atrule like @font-face
rule String, RegExp, Function Match rule like .big-background-image {...}
decl String, RegExp, Function Match declarations
css String CSS String or path to file containing css

You can also pass a filter function for any of the supported types. The function is invoked with two arguments (node, value).

  • node The currently processed AST node generated by postcss.
  • value Current value.

Return true if the element should be discarded.

Examples

Diffing stylesheets

postcss(discard({css: 'STYLES TO BE REMOVED'})).process('ORIGINAL CSS').css;

Discard by specifying rules

.bg {
  width: 100%;
  height: 100%;
  background-image: url('some/big/image.png');
}

@font-face {
  font-family: 'My awesome font';
}

@media print {
  ...;
}
postcss([
  discard({
    atrule: ['@font-face', /print/],
  }),
]);
.bg {
  width: 100%;
  height: 100%;
}