我无法让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'));
});
但是只要我在混合中添加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'));
});
为什么?我究竟做错了什么?如果我在gulp-if
源代码中添加一些日志,我可以看到条件 正在传递。
答案 0 :(得分: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'));
});
这将创建一个过滤的流,restore()
将恢复流。 gulpIf
用于有条件地处理整个流,而不仅仅是匹配文件。
gulp.src('src/**/*.js', function () {
.pipe(gulpIf(isProduction, concat('all.js')))
.pipe(gulp.dest('dest/')
});
答案 1 :(得分:3)
这听起来像gulp-if
中的错误。尝试将gulp-if
升级到最新版本,如果不起作用,请在https://github.com/robrich/gulp-if/issues上发布问题。
答案 2 :(得分:1)
gulp.task('css', function() {
var condition = function(file) {
if (file.extname == '.less') return true;
};
return gulp.src([
'bower_components/bootstrap/dist/css/bootstrap.css',
'app/stylesheets/main.less',
])
.pipe(gulpif(condition, less({
strictMath: true,
strictUnits: true,
})))
.pipe(concat('all.css', {newLine: '\n'}))
.pipe(prefixer('> 1%'))
.pipe(minifyCss())
.pipe(gulp.dest('public/css'));
});