gulp常用插件-gulp-clean-css

使用gulp-clean-css壓縮css文件，減小文件大小，並給引用url添加版本號避免緩存。（之前的有同樣功能的gulp-minify-css已被廢棄）
github：https://github.com/scniro/gulp-clean-css
配置gulpfile.js
例子一

var gulp = require('gulp'),
 cssmin = require('gulp-clean-css');
gulp.task('testCssmin', function () {
 gulp.src('src/css/*.css')




 .pipe(cssmin())
 .pipe(gulp.dest('dist/css'));
});

例子二

var gulp = require('gulp'),
 cssmin = require('gulp-clean-css');
gulp.task('testCssmin', function () {
 gulp.src('src/css/*.css')
 .pipe(cssmin({
 advanced: false,//類型：Boolean 默認：true [是否開啟高級優化（合並選擇器等）]
 compatibility: 'ie7',//保留ie7及以下兼容寫法 類型：String 默認：''or'*' [啟用兼容模式； 'ie7'：IE7兼容模式，'ie8'：IE8兼容模式，'*'：IE9+兼容模式]
 keepBreaks: true,//類型：Boolean 默認：false [是否保留換行]
 keepSpecialComments: '*'
 //保留所有特殊前綴 當你用autoprefixer生成的瀏覽器前綴，如果不加這個參數，有可能將會刪除你的部分前綴
 }))
 .pipe(gulp.dest('dist/css'));
});

更多的gulp-clean-css的API請到這裏了解： https://github.com/jakubpawlowicz/clean-css#how-to-use-clean-css-api
例子三
給css文件裏引用url加版本號（根據引用文件的md5生產版本號），像這樣：

var gulp = require('gulp'),




 cssmin = require('gulp-clean-css');
 //確保已本地安裝gulp-make-css-url-version [cnpm install gulp-make-css-url-version save-dev]
 cssver = require('gulp-make-css-url-version');
gulp.task('testCssmin', function () {
 gulp.src('src/css/*.css')
 .pipe(cssver()) //給css文件裏引用文件加版本號（文件MD5）
 .pipe(cssmin())
 .pipe(gulp.dest('dist/css'));
});

若想保留注釋，這樣注釋即可：

/*!
 Important comments included in minified output.
*/

命令提示符執行：gulp testCssmin