cmify (aka node-css-modules)
A node-first approach to CSS Modules, so you can use CSS Modules on the server without any extra tools.
Example
var cmify = require('cmify')
var styles = cmify.load('./styles.css')
console.log('Generated classnames:', styles)
console.log('Generated CSS:', cmify.getAllCss())
For a complete example take a look at cmify-example
Building for the browser
With browserify:
npm install -D browserify
browserify -p cmify/plugin src/index.js
With hot module reloading:
npm install -D watchify browserify-hmr
watchify -p browserify-hmr -p cmify/plugin src/index.js -o dist/index.js
Saving the generated CSS to a file:
npm install -D browserify
browserify -p [cmify/plugin -o lib/out.css] src/index.js
Note: -o
is an alias for --outfile
.
How to add postcss plugins
You can add postcss plugins before or after the core CSS Modules transformation:
const cmify = require('cmify')
cmify.init({
cssBefore: [ /* array of postcss plugins */ ],
cssAfter: [ /* array of postcss plugins */ ],
generateScopedName: (originalFn) => function (exportedName, filename) => String
})
cmify.init
is optional. It should only be called once, and needs to be called before the first cmify.load
.
Thanks
to the CSS Modules team and contributors
License
MIT