Clean-css is a node.js library for minifying CSS files. It does the same job as YUI Compressor's CSS minifier, but much faster thanks to many speed optimizations and node.js' V8 engine.
node.js 0.8.0+ (tested on CentOS, Ubuntu, OS X 10.6+, and Windows 7+)
npm install clean-css
Clean-css accepts the following command line arguments (please make sure
you use <source-file>
as the very last argument to avoid potential issues):
cleancss [options] <source-file>
-h, --help Output usage information
-v, --version Output the version number
-e, --remove-empty Remove empty declarations, e.g. a{}
-b, --keep-line-breaks Keep line breaks
--s0 Remove all special comments, i.e. /*! comment */
--s1 Remove all special comments but the first one
-r, --root [root-path] A root path to which resolve absolute @import rules and rebase relative URLs
-o, --output [output-file] Use [output-file] as output instead of STDOUT
-s, --skip-import Disable @import processing
--skip-rebase Disable URLs rebasing
-d, --debug Shows debug information (minification time & compression efficiency)
To minify a public.css file into public-min.css do:
cleancss -o public-min.css public.css
To minify the same public.css into the standard output skip the -o
parameter:
cleancss public.css
More likely you would like to concatenate a couple of files. If you are on a Unix-like system:
cat one.css two.css three.css | cleancss -o merged-and-minified.css
On Windows:
type one.css two.css three.css | cleancss -o merged-and-minified.css
Or even gzip the result at once:
cat one.css two.css three.css | cleancss | gzip -9 -c > merged-minified-and-gzipped.css.gz
var cleanCSS = require('clean-css');
var source = 'a{font-weight:bold;}';
var minimized = cleanCSS.process(source);
Process method accepts a hash as a second parameter, i.e.,
cleanCSS.process(source, options)
with the following options available:
keepSpecialComments
-*
for keeping all (default),1
for keeping first one,0
for removing allkeepBreaks
- whether to keep line breaks (default is false)removeEmpty
- whether to remove empty elements (default is false)benchmark
- turns on benchmarking mode measuring time spent on cleaning up (runnpm run bench
to see example)root
- path to resolve absolute@import
rules and rebase relative URLsrelativeTo
- path with which to resolve relative@import
rules and URLsprocessImport
- whether to process@import
rulesnoRebase
- whether to skip URLs rebasing
First clone the source, then run:
npm run bench
for clean-css benchmarks (see test/bench.js for details)npm run check
to check JS sources with JSHintnpm test
for the test suite
Use the /*!
notation instead of the standard one /*
:
/*!
Important comments included in minified output.
*/
Clean-css will handle it automatically for you (since version 1.1) in the following cases:
- When using the CLI:
- Use an output path via
-o/--output
to rebase URLs as relative to the output file. - Use a root path via
-r/--root
to rebase URLs as absolute from the given root path. - If you specify both then
-r/--root
takes precendence.
- Use an output path via
- When using clean-css as a library:
- Use a combination of
relativeTo
andtarget
options for relative rebase (same as 1 in CLI). - Use a combination of
relativeTo
androot
options for absolute rebase (same as 2 in CLI). root
takes precendence overtarget
as in CLI.
- Use a combination of
- Vincent Voyer (@vvo) for a patch with better empty element regex and for inspiring us to do many performance improvements in 0.4 release.
- Isaac (@facelessuser) for pointing out a flaw in clean-css' stateless mode.
- Jan Michael Alonzo (@jmalonzo) for a patch
removing node.js' old
sys
package. - @XhmikosR for suggesting new features (option to remove special comments and strip out URLs quotation) and pointing out numerous improvements (JSHint, media queries).
- Anthony Barre (@abarre) for improvements to
@import
processing, namely introducing the--skip-import
/processImport
options.
Clean-css is released under the MIT License.