cngen
Generate CSS classnames from declarations, works splendid together with e.g. React
Why?
Generating classnames according to the contents of a CSS declaration solves the biggest problem with large scale CSS, i.e. the fact that it cascades. See unistyle
for how to use this in a scalable way.
Installation
Install cngen
using npm:
npm install --save cngen
Usage
Module usage
var cngen = require('cngen');
cngen({
color: '#FFF',
fontSize: '10px'
});
Property order is not important, i.e. two declarations with the same properties but in a different order gives the same classname, e.g:
var cngen = require('cngen');
cngen({
color: '#FFF',
fontSize: '10px'
});
cngen({
fontSize: '10px',
color: '#FFF'
});
Usage together with e.g. React
Have a look at unistyle
for how this fits together with React.
API
cngen(declaration)
Name | Type | Description |
---|
declaration | Object | The CSS declaration to generate a classname for |
Returns: String
, a generated classname, which consists of a "_"
followed by a hexadecimal string (generated with short-hash
).
License
MIT © Joakim Carlstein