javascript - gulp - 缩小 CSS 时排除文件

Question

我是 Gulp 的新手。我已经能够成功安装、连接和缩小我的 .js 和 .css 文件，但是，有一个我想排除的 .css 文件 - print.css

我按照此处的说明操作:https://www.npmjs.org/package/gulp-ignore在我的本地目录中安装 gulp-ignore，并将我的 gulpfile.js 修改为:

// Include gulp
var gulp = require('gulp'); 

// Include Our Plugins
var jshint = require('gulp-jshint');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var minifyCSS = require('gulp-minify-css');
var imagemin = require('gulp-imagemin');
var exclude = require('gulp-ignore').exclude;


var paths = {
  scriptsNonAuth: ['Non-Auth/javascript/*.js'],
  scriptsAuth: ['Auth/javascript/*.js'],
  stylesNonAuth: ['Non-Auth/css/*.css'],
  stylesAuth: ['Auth/css/*.css'],
};

// CSS Task - Non Authenticated
gulp.task('minify-css-non-auth', function() {
  gulp.src(paths.stylesNonAuth)
    .pipe(minifyCSS(opts))
    .pipe(concat('all.min.css'))
    .pipe(gulp.dest('Non-Auth/css'))
});

// CSS Task - Authenticated
gulp.task('minify-css-auth', function() {
  gulp.src(paths.stylesAuth)
    .pipe(minifyCSS(opts))
    **.pipe(exclude('Auth/css/print.css'))**
    .pipe(concat('all.min.css'))
    .pipe(gulp.dest('Auth/css'))
});

在我的 CSS 任务 - 安全中，我包含了 .pipe(exclude('Secure/css/print.css'))

当我运行 gulp minify-css-secure 时，任务完成但在检查新的 all.min.css 时，我也看不到其中的 print.css 的内容。

Answer 1

不清楚您要实现的目标。如果我做对了，你想:

1. 缩小所有 css 文件(包括 print.css)
2. 将除 print.css 之外的所有文件合并为 all.min.css
3. 将缩小的 all.min.css 和 print.css 放入目标文件夹

为此，您可以使用 StreamQueue . ( source )

var streamqueue = require('streamqueue');

var paths = {
  scriptsNonAuth: ['Non-Auth/javascript/*.js'],
  scriptsAuth: ['Auth/javascript/*.js'],
  stylesNonAuth: ['Non-Auth/css/*.css'],
  stylesAuth: ['Auth/css/*.css', '!Auth/css/print.css'],
};

gulp.task('minify-css-auth', function() {
  return streamqueue({ objectMode: true },
    gulp.src(paths.stylesAuth)
        .pipe(minifyCSS(opts))
        .pipe(concat('all.min.css')),
    gulp.src('Auth/css/print.css'))
        .pipe(minifyCSS(opts))
  )
   .pipe(gulp.dest('Auth/css'))
});

如果你只想排除一些文件，你不需要 gulp-ignore。 Gulp 支持忽略 glob。 只需在要排除的路径前添加 bang。
像这样:

stylesAuth: ['Auth/css/*.css', '!Auth/css/print.css']