cssbag

cssbag is a collection of PostCSS plugins I use, it's similar to precss.

Install

$ npm install -D cssbag

Usage

const cssbag = require('cssbag')

postcss([cssbag(options)]).process(css) //...

API

cssbag([options])

Each plugin has its own option namespace. For example, if you want to set options for postcss-smart-import, simply:

postcss([
  cssbag({
    'smart-import': {},
    // or use camelCase
    smartImport: {}
  })
])

Plugins

postcss-nested

Unwrap nested rules like how Sass does it.

postcss-advanced-variables

Sass-like variables, conditionals, and iteratives.

postcss-custom-properties

Transform W3C CSS Custom Properties for cascading variables.

postcss-smart-import

Loading/including other files (transform @import rules by inlining content) and quering/referring assets (referred in url() functions). Think of postcss-import + postcss-url + postcss-assets.

postcss-mixins

PostCSS plugin for mixins.

postcss-calc

PostCSS plugin to reduce calc()

postcss-media-minmax

Writing simple and graceful Media Queries!

postcss-custom-selectors

Transform W3C CSS Extensions(Custom Selectors) to more compatible CSS.

postcss-custom-media

Transform W3C CSS Custom Media Queries to more compatible CSS

postcss-property-lookup

PostCSS plugin for property lookups, similar to Stylus.

postcss-selector-matches

Transform :matches() W3C CSS pseudo class to more compatible CSS (simpler selectors).

postcss-selector-not

Transform :not() W3C CSS level 4 pseudo class to more compatible CSS (multiple css3 :not() selectors).

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. Submit a pull request :D

License

MIT © EGOIST