如何使用gulp-if有条件地编译较少的文件?

mpe*_*pen 5 gulp gulp-if

如果工作正常,我无法得到咕噜声.

没有gulp-如果它工作正常:

gulp.task('css', function() {
    return gulp.src([
    //  'bower_components/bootstrap/dist/css/bootstrap.css',
        'app/stylesheets/main.less',
    ])
    .pipe(less({
        strictMath: true,
         strictUnits: true,
    }))
    .pipe(concat('all.css', {newLine: '\n'}))
    .pipe(prefixer('> 1%'))
    .pipe(minifyCss())
    .pipe(gulp.dest('public/css'));
});
Run Code Online (Sandbox Code Playgroud)

但是当我添加gulp-if到混合中时,gulpif管道返回到主流时不会返回任何内容:

gulp.task('css', function() {
    return gulp.src([
        'bower_components/bootstrap/dist/css/bootstrap.css',
        'app/stylesheets/main.less',
    ])

        .pipe(gulpif(/\.less$/,less({
            strictMath: true,
            strictUnits: true,
        })))
        .pipe(concat('all.css', {newLine: '\n'}))
        .pipe(prefixer('> 1%'))
        .pipe(minifyCss())
        .pipe(gulp.dest('public/css'));
});
Run Code Online (Sandbox Code Playgroud)

这是为什么?我究竟做错了什么?如果我在gulp-if源代码中添加一些日志,我可以看到条件正在传递.

Nic*_*oll 12

我想你可能想要使用gulp-filter:https://www.npmjs.org/package/gulp-filter

gulp.task('css', function() {
    var lessFilter = gulpFilter('**/*.less', {restore: true})
    return gulp.src([
        'bower_components/bootstrap/dist/css/bootstrap.css',
        'app/stylesheets/main.less',
    ])

    .pipe(lessFilter)
    .pipe(less({
        strictMath: true,
        strictUnits: true,
    }))
    .pipe(lessFilter.restore)

    .pipe(concat('all.css', {newLine: '\n'}))
    .pipe(prefixer('> 1%'))
    .pipe(minifyCss())
    .pipe(gulp.dest('public/css'));
});
Run Code Online (Sandbox Code Playgroud)

这将创建一个过滤流,restore()并将恢复流.gulpIf有条件地处理整个流而不仅仅是匹配文件.

gulp.src('src/**/*.js', function () {
    .pipe(gulpIf(isProduction, concat('all.js')))
    .pipe(gulp.dest('dest/')
});
Run Code Online (Sandbox Code Playgroud)

  • 你是对的.`gulp-if`使用`gulp-match`来处理正则表达式.这也应该是有效的:`.pipe(gulpIf('**/*.less'),less(lessOptions))` (2认同)
  • gulp-if 和 gulp-filter 满足不同的需求。gulp-filter 从流中删除与过滤器匹配的内容。gulp-if 是一个三元流,将事物传递给 if 和 else 流(如果匹配),然后将所有内容传递到下游。 (2认同)