filter-css [![npm version][npm-image]][npm-url] [![Build Status][ci-image]][ci-url] [![dependencies Status][depstat-image]][depstat-url] [![devDependencies Status Status][devdepstat-image]][devdepstat-url]

Filter CSS rules

Install

``shell
npm install --save filter-css
`

Usage

`js
const filterCss = require('filter-css');
const filtered = filterCss(, , );
`

$3

Required*
* Type: String

Can be a path to the CSS file or a raw CSS string.

$3

Required*
* Type String,RegExp, Function or an Array containing it.

Patterns used to discard specific parts of the CSS.
The function is invoked with three arguments (context, value, node).

* context: Current matching context. Could be one of ['type', 'media', 'selector', 'declarationProperty', 'declarationValue'].
* value: Current value.
* node: The currently processed AST node generated by css.

Return true if the element should be discarded.

$3

Per default filter-css will be applied to all parts of the CSS. This behavior can be customized by disabling specific matchers.

| Name | Type | Description |
| -------------------------- | --------- |-------------- |
| matchSelectors | boolean | Enable / disable matching of CSS selectors. |
| matchTypes | boolean | Enable / disable matching of AST Node types like font-face |
| matchDeclarationProperties | boolean | Enable / disable matching of CSS properties like background-image |
| matchDeclarationValues | boolean | Enable / disable matching of CSS values like url(...)
| matchMedia | boolean | Enable / disable matching of media queries like min-device-pixel-ratio: 2 |

Examples

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

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

@media print {
...
}
`

`js
const filterCss = require('filter-css');

filterCss('test/fixtures/test.css', [/url\(/,'@font-face',/print/]);
`

`css
.bigBackground {
width: 100%;
height: 100%;
}
`

$3

`js
const filterCss = require('filter-css');

filterCss('test/fixtures/test.css', /.*/, {
matchSelectors: false,
matchTypes: false,
matchDeclarationProperties: false,
matchDeclarationValues: false,
matchMedia: true
});
`

$3

`js
const filterCss = require('filter-css');

filterCss('test/fixtures/test.css', (context, value, node) => {
return context === 'declarationValue' && value === "url('some/big/image.png')"
});

`

$3

`js
filterCss('test/fixtures/test.css', {
types: ['@font-face'],
selectors: ['.my-selector > p'],
declarations: [/url/]
});
`

CLI

filter-css works well with standard input.

`shell
cat test/fixture/test.css | filtercss --ignore @font-face
`

You can also pass in the file as an option.

`shell
filtercss test/fixture/test.css --ignore @font-face
`

$3

See filtercss --help` for a full list of options.

License

MIT © Ben Zörb

[npm-url]: https://npmjs.org/package/filter-css
[npm-image]: https://img.shields.io/npm/v/filter-css.svg

[ci-url]: https://github.com/bezoerb/filter-css/actions?workflow=Tests
[ci-image]: https://github.com/bezoerb/filter-css/workflows/Tests/badge.svg

[depstat-url]: https://david-dm.org/bezoerb/filter-css
[depstat-image]: https://img.shields.io/david/bezoerb/filter-css.svg

[devdepstat-url]: https://david-dm.org/bezoerb/filter-css?type=dev
[devdepstat-image]: https://img.shields.io/david/dev/bezoerb/filter-css.svg