0

我gulp-useref用来连接和缩小我的脚本资产。由于我的项目包含一些bootstrap样式，我想修剪它所有不必要的部分。为此，我集成了gulp-purifycss插件。我现在尝试使用gulp-useref'stransformStream功能来选择性地仅净化bootstrap.css，这导致我的缩小 javascript 和 CSS 的输出文件无效。例如，生成的 javascript 文件也包含所有的bootstrap.css，而 CSS 文件只包含大约两行我自己的 CSS。

这是我的吞咽任务：

var gulp = require('gulp');
var $ = require('gulp-load-plugins')();
var htmlminOpts = {
  collapseWhitespace: true,
  removeComments: true,
  removeRedundantAttributes: true,
  removeScriptTypeAttributes: true,
  minifyJS: true,
  minifyCSS: true
};
var cssminOpts = {
  keepSpecialComments: 0
};

// ...

gulp.task('scripts:public', function() {
  return gulp.src('client/public/index.html')
    .pipe($.useref({
      searchPath: ['client/public', './']
    }, require('lazypipe')().pipe($.if, function(file) {
      return file.path.indexOf('bootstrap.css') > -1;
    }, $.purifycss(['client/public/**/*.html']))))
    .pipe($.if('**/bower_components/**/*.js', $.fixmyjs()))
    .pipe($.if('*.js', $.uglify().on('error', $.util.log)))
    .pipe($.if('*.html', $.htmlmin(htmlminOpts)))
    .pipe($.if('*.css', $.cssmin(cssminOpts)))
    .pipe(gulp.dest('../dist/client/public'));
});

可能我transformStream以错误的方式使用了，但是在这方面文档非常少，因为它只告诉我 Transform assets before concat.，这正是我想要的：在它与我自己的 CSS 连接之前进行bootstrap.css转换。purifycss

提前感谢您对正确方向的任何提示！

4

0 回答 0