Add minify option

Uses cssnano to minify the output

Author: simonsmith

bin/suitcss

@@ -18,6 +18,7 @@ var writeFileSync = fs.outputFileSync;
 program
   .version(require('../package.json').version)
   .usage('[<input>] [<output>]')
+  .option('-m, --minify', 'minify output with cssnano')
   .option('-i, --import-root [path]', 'the root directory for imported css files', '')
   .option('-c, --config [path]', 'a custom PostCSS config file', '')
   .option('-v, --verbose', 'log verbose output for debugging')
@@ -107,7 +108,7 @@ function run () {
     var css = buffer.toString();
 
     suitcss(css, {
-      compress: program.compress,
+      minify: program.minify,
       root: program.importRoot,
       config: config
     }).then(function(result) {

lib/index.js

@@ -7,6 +7,7 @@ var last = require('lodash/array/last');
 var autoprefixer = require('autoprefixer');
 var bemLinter = require('postcss-bem-linter');
 var postcss = require('postcss');
+var cssnano = require('cssnano');
 var reporter = require('postcss-reporter');
 
 /**
@@ -16,6 +17,7 @@ var reporter = require('postcss-reporter');
 module.exports = preprocessor;
 
 var defaults = {
+  minify: undefined,
   use: [
     'postcss-import',
     'postcss-custom-properties',
@@ -38,6 +40,17 @@ var defaults = {
   },
   'postcss-reporter': {
       clearMessages: true
+  },
+  // http://cssnano.co/optimisations/
+  cssnano: {
+    calc: false,
+    autoprefixer: false,
+    mergeRules: false,
+    // Disable unsafe optimisations
+    zindex: false,
+    discardUnused: false,
+    reduceIdents: false,
+    mergeIdents: false
   }
 };
 
@@ -63,9 +76,13 @@ function preprocessor(css, options) {
     return settings ? plugin(settings) : plugin;
   });
 
-  var processor = postcss(plugins).process(css);
+  var processor = postcss(plugins);
+
+  if (options.minify) {
+    processor.use(cssnano(options.cssnano));
+  }
 
-  return processor;
+  return processor.process(css);
 }
 
 
@@ -80,6 +97,8 @@ function mergeOptions(options) {
   options.config = options.config || {};
 
   var merged = assign({}, defaults, options.config);
+
+  merged.minify = options.minify;
   merged['postcss-import'].root = options.root;
 
   // Ensure postcss-reporter is always the final plugin

package.json

@@ -16,6 +16,7 @@
     "colors": "~1.1.2",
     "commander": "~2.9.0",
     "fs-extra": "^0.26.2",
+    "cssnano": "^3.3.2",
     "lodash": "^3.10.1",
     "object-assign-deep": "0.0.4",
     "pad-component": "0.0.1",

test/fixtures/minify.out.css

@@ -0,0 +1 @@
+.u-img{border-radius:50%}.Component{font-size:16px;width:16.66667%}.Component-item{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex}@media (min-width:200px){.Component-item{color:red}}

test/test.js

@@ -42,6 +42,11 @@ describe('suitcss', function () {
       expect(opts['postcss-import'].root).to.equal('test/root');
     });
 
+    it('should allow an minify option to be set', function() {
+      var opts = mergeOptions({minify: true});
+      expect(opts.minify).to.be.true;
+    });
+
     it('should merge config options with existing defaults', function() {
       var autoprefixer = {browsers: ['> 1%', 'IE 7'], cascade: false};
       var opts = mergeOptions({
@@ -142,6 +147,16 @@ describe('cli', function () {
     });
   });
 
+  it('should minify the output', function (done) {
+    exec('bin/suitcss -i test/fixtures test/fixtures/import.css test/fixtures/cli/output.css -m', function (err, stdout) {
+      if (err) return done(err);
+      var res = read('fixtures/cli/output');
+      var expected = read('fixtures/minify.out');
+      expect(res).to.equal(expected);
+      done();
+    });
+  });
+
   it('should allow a config file to be passed', function (done) {
     exec('bin/suitcss -i test/fixtures -c test/test.config.js test/fixtures/config.css test/fixtures/cli/output.css', function (err, stdout) {
       if (err) return done(err);