使用gulp-uncss精簡css,去除冗余代碼

寫html頁面的時候，多修改幾次就會出現很多無用的css代碼，下面使用gulp-uncss來精簡css文件,去掉沒用的css代碼

1.首先找個目錄創建一個gulp項目在命令行輸入：npm init  然后一路回車創建一個項目

2.安裝gulp和gulp-uncss --save -dev 在命令行輸入：

npm install gulp

npm install gulp-uncss --save -dev

3.安裝完成后在目錄里創建一個文件 gulpfile.js（文件名不要改，改了會報錯），然后在gulpfile.js文件里面寫需要執行的任務，比如定義一個叫uncss的任務，這個名字在執行的時候會用到，代碼：

 

var gulp = require('gulp');  
var uncss = require('gulp-uncss');

gulp.task('uncss', function () {  
    return gulp.src('screen.css') //需要進行處理的css
        .pipe(uncss({
			html:['default.html']  //使用css的html文件，可以多個
        }))
        .pipe(gulp.dest('./out'));  //輸出目錄
});

console.log('done')

　

4.在項目目錄中打開cmd 輸入：gulp uncss

5.結果輸出

 6.這個東西還可以有其他用途，比如扒了別人的樣式，可以直接使用此方法剔除掉冗余的css...~~~~