postcss-filename-prefix
Postcss plugin for prefixing classes with corresponding filenames
Last updated a year ago by cray0000 .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install postcss-filename-prefix 
SYNC missed versions from official npm registry.

postcss-filename-prefix

A PostCSS plugin to prefix classes with corresponding filenames
The idea is to isolate styles in framework components

js-standard-style

MyComponent.css

.myclass { /* ... */ }
.-mymodifier { /* ... */ }
.Mycapitalclass { /* ... */ }

Output:

.MyComponent-myclass { /* ... */ }
.-mymodifier { /* ... */ }
.Mycapitalclass { /* ... */ }

Ignores:

  • filenames that starts from not capital letter
  • modifiers (classes that starts from hyphen)
  • classes that starts from capital letter

Installation

npm install postcss-filename-prefix

Usage

var fs        = require('fs');
var postcss   = require('postcss');
var filenamePrefix = require('postcss-filename-prefix');

var css = fs.readFileSync('css/MyFile.css', 'utf8').toString();
var out = postcss()
          .use(filenamePrefix())
          .process(css);

Using the ignore option

var fs        = require('fs');
var postcss   = require('postcss');
var filenamePrefix = require('postcss-filename-prefix');

var css = fs.readFileSync('css/MyFile.css', 'utf8').toString();
var out = postcss()
          .use(filenamePrefix({ ignore: [/ng-/, 'some-class-to-ignore']}))
          .process(css);

License

MIT

Recommendation

Acknowledgements

Current Tags

  • 2.0.0                                ...           latest (a year ago)

6 Versions

  • 2.0.0                                ...           a year ago
  • 1.0.1                                ...           2 years ago
  • 1.0.0                                ...           5 years ago
  • 0.3.0                                ...           6 years ago
  • 0.2.0                                ...           6 years ago
  • 0.1.0                                ...           6 years ago
Maintainers (2)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 1
Dependencies (0)
None
Dev Dependencies (12)

Copyright 2014 - 2021 © npmmirror.com |