PostCSS Sparrow Units Filter

A PostCSS Sparrow plugin that helps you search CSS declarations by units.

This plugin is designed to be used with PostCSS Sparrow, which helps you filter CSS declarations by selectors. By using these two plugins together, you can easily get the declarations you need.

Made in Hong Kong 🆓 🆓

This plugin is made with love by a Hong Konger.

Installation

This plugin require you to use PostCSS Sparrow for matching with selectors you want.

Download both postcss-sparrow and this plugin through NPM.

 
npm i postcss-sparrow postcss-sparrow-units-filter
 

Then import this plugin as the callback for PostCSS Sparrow.

//postcss.config.js
module.exports = {
  plugins: [
    //Other plugins...
 
    require('postcss-sparrow')({
      transformations: [
        {
          selectors: ['*'],
          inclusion: true,
          callbacks: [
            require('postcss-sparrow-units-filter')(
              {
                units: ['px', 'rem', 'em'],
                inclusion: true,
                callbacks: [
                  //Do transformation here with your own callback functions
                  (decl) => {
                    decl.remove()
                  }
                ]
              }
            )
          ]
        }
      ]
    })
  ]
}

API Reference

options.units : Array

An array of units that you want to match with. Use * as wildcard and select all units.

For example, px will match padding: 20px.

options.inclusion : Boolean

True for including and False for excluding selectors listed in options.units.

options.callbacks : Array

An array of callbacks that you use to transform the selected declarations. The selected declaration will be passed in as an argument.