A PostCSS plugin to prefix/namespace classes.
Avoid collisions with other libraries/stylesheets by prefixing your components with a namespace.
Example input
.Component { /* ... */ }
.Component--modifier { /* ... */ }
.Component-descendent { /* ... */ }
Example output
classPrefix('pfx-')
.pfx-Component { /* ... */ }
.pfx-Component--modifier { /* ... */ }
.pfx-Component-descendent { /* ... */ }
npm install postcss-class-prefix
var fs = require('fs');
var postcss = require('postcss');
var classPrfx = require('postcss-class-prefix');
var css = fs.readFileSync('css/my-file.css', 'utf8').toString();
var out = postcss()
.use(classPrfx('my-prefix-'))
.process(css);
var fs = require('fs');
var postcss = require('postcss');
var classPrfx = require('postcss-class-prefix');
var css = fs.readFileSync('css/my-file.css', 'utf8').toString();
var out = postcss()
.use(classPrfx('my-prefix-', { ignore: [/ng-/, 'some-class-to-ignore']}))
.process(css);
MIT
- Based on rework-class-prefix (originally)