Remove unused CSS | rm-unused-css

Remove unused css and duplicated css rules from your website. This tool removes duplicated rules and searches in html and js for unused css. Please keep in mind that not all unused css can be found, because of js injections! In my test 80-90% of unused css can be removed. This supports all kind off css frameworks, bootstrap, tailwindcss, foundation and more....

Check out the webpack plugin for usage with webpack.

Installing

To utilize for node.js install the the npm module:

$ npm install rm-unused-css --save

Check out the example folder!

const rmUnusedCss = require('rm-unused-css');
const cssSource = 'css/style.css';
rmUnusedCss(cssSource, { path: './**/+(*.html|*.htm|*.js)', override: true }).then((result) => {
    console.log(result.file, result.newContent)
});

Source: [cssSource]

Could be a single file path, array or a string with CSS content.

Options

{
    // Glob path to the js and html files. Set to null or false if you don't want to remove unused selectors
    path: '**/+(*.html|*.htm|*.js)',
    // Override the input file
    override: false,
    // exclude files
    exclude: [],
    // RegExp css class patterns. Example: /myclass_.*/
    whitelistPatterns: [],
    blacklistPatterns: [],
    // glob package options
    globOptions: {
        ignore: 'node_modules/**/*'
    }
}

Build Plugin

• Webpack

Contributing

1. Fork it
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create new Pull Request

Donate