CSS Byebye

CSS Byebye is a node module that lets you explicitly remove the CSS rules that you don't want.

Description

It's very simple: pass a list of selectors that you want to exclude and it will remove them and the associated rules from your CSS.

I've found some cases where this approach is easier than using more powerful tools like uncss. Use what's best for you and give some feedback :)

CSS Byebye is built with postcss.

A grunt task for CSS Byebye exists: grunt-css-byebye.

Usage

CSS Byebye is a CSS post processor and a postcss plugin; read the postcss docs for more details.

Run it as indicated in postcss docs:

postcss(cssbyebye(options)).process(css)

css is your stylesheet
options is an object that has at least the rulesToRemove property defined.

options

rulesToRemove is an array of strings or regular expressions (selectors).

If you provide a string, it will remove the rule(s) for this exact selector.

Examples

Some CSS:

 a { font-size: 12px; }
 .hello .h1 { background: red }
 .world { color: blue }

Using the plugin:

var postcss = require('postcss')
var cssbyebye = require('css-byebye')

var rulesToRemove = ['.hello .h1', '.world']
var options = { rulesToRemove: rulesToRemove, map: false }

// pretend that css var contains the css above
var result = postcss(cssbyebye(options)).process(css)

result will be an object like this:

{
  css: 'a { font-size: 12px; }'
}

If you use the postcss map option, then source map will be added to the result object.

You can mix strings and regular expressions

var rulesToRemove = [
  '.hello',
  /.*\.world.*/
]

In this case, it would:

remove a rule with the exact selector .hello
remove any rule that contains the .world class.

Changelog

2015-09-25 v1.0.1

Upgrade to postCSS 5.x
Docs improved.
The project uses js standard code style.

2015-06-09 v1.0.0

Breaking changes and bumped to 1.0.0
Update to last postCSS version
Now can be piped with other postCSS plugins

2014-10-19 v0.2.0

The default behaviour is to match the exact selector when a string is given.
Added the possibility to match with regular expressions.

b2io / css-byebye