gulp-clean-useless-css

一个基于gulp移除无用css的中间件

Install

$ npm install gulp-clean-useless-css --save-dev

使用说明

1. 引用gulp-clean-useless-css
var cleanUselessCSS = require('gulp-clean-useless-css')

2. 创建任务
//定义名为cleancss的任务
gulp.task('cleancss', function() {
  return gulp.src([
    'css/global.css',
    'css/index-1.css'
  ])
    .pipe(concat('main.css'))
    .pipe(cleanUselessCSS([
      'src/x-select2.js',
      'src/x-select3.js',
      'src/x-table.js',
      'src/x-modal.js'

      'signin.html',
      'signout.html',
      'signup.html'
    ]))
    .pipe(gulp.dest('dist'))
})

工作原理

.aa .bb .cc { ... } 这条规则中只要aa,bb,cc有仍何一个未在源js,html中出现，则该条规则可以移除

注：会误伤以下方式定义的样式

1. js中类似 '.level' + '01 .section { ... }'
2. 类名.class或#ID是从数据库中读出的情况