Using clean-css directly in your gulp recipe

[sogko]

Hi guys,

I just want to share a gulp recipe to minify css using the CleanCSS library, with the help of vinyl-map (a really useful library by @hughsk that you can use adapt most nodejs modules to work into your gulp streams)

var gulp = require('gulp');
var CleanCSS = require('clean-css');
var map = require('vinyl-map');

gulp.task('minify-css' , function minifyCSSTask() {
  // this snippet basically replaces `gulp-minify-css`
  var minify = map(function (buff, filename) {
    return new CleanCSS({
      // specify your clean-css options here
    }).minify(buff.toString());
  });

  return gulp.src('css/**/*.css')
    .pipe(minify)
    .pipe(gulp.dest('dist'));
});

This helps to reduce the need for a gulp-plugin wrapping around clean-css and allows you to use clean-css outside of your gulpfile.js

[jakubpawlowicz]

I've just added it to our Readme. Thanks for the useful tip!

[philippe-git]

Updated recipe for clean-css 3.x:

var gulp = require('gulp');
var CleanCSS = require('clean-css');
var map = require('vinyl-map');

gulp.task('minify-css' , function minifyCSSTask() {
  // this snippet basically replaces `gulp-minify-css`
  var minify = map(function (buff, filename) {
    return new CleanCSS({
      // specify your clean-css options here
    }).minify(buff.toString()).styles;
  });

  return gulp.src('css/**/*.css')
    .pipe(minify)
    .pipe(gulp.dest('dist'));
});