rework is a tool for CSS manipulations built on css, allowing you to automate vendor prefixing, create your own properties, inline images, anything you can imagine! Also works in the browser.
|
1
|
npm install rework |
Originally written by TJ Holowaychuk, rework is a module for working with CSS. Just like esprima for JavaScript, rework allows you to change and extend CSS, basically take it to a whole new level.
Example
To get an idea of how to use rework, take a look at one of the many plugins. A good example would be rework-imagesize plugin.
|
1
2
3
4
5
6
|
var rework = require('rework');var size = require('rework-imagesize');var css = rework(str) .use(size('path/to/images/folder')) .toString(); |
Using the above JavaScript. This:
|
1
2
3
4
5
|
h1 { background: url('myimage.png'); imgsize: myimage.png; text-indent: 100%;} |
Would produce something like:
|
1
2
3
4
5
6
|
h1 { background: url('myimage.png'); text-indent: 100%; height: 201px; width: 300px;} |
Rework Github account has a good number of modules to do various things to your CSS. I also like the idea of using rework as a post processor for your favourite dynamic CSS language, such as LESS, Stylus or SASS.
Curious what is your favourite dynamic CSS framework?
Image borrowed from horrible logos and isn’t the official logo 🙂
