Question

基本上我想设置我的任务，这样如果我做gulp less --watch它会看，否则只是做构建。这就是我到目前为止所做的：

'use strict';

var gulp = require('gulp');
var less = require('gulp-less');
var gulpif = require('gulp-if');
var watch = require('gulp-watch');
var cli = require('minimist')(process.argv.slice(2));

gulp.task('less', function () {
  return gulp.src(['./client/styles/styles.less', './client/styles/libs.less'])
    .pipe(less({ sourceMap: !cli.production }))
    .pipe(gulp.dest('./dist/styles'))
    .pipe(gulpif(cli.watch, watch()));
});

它会执行watch，但不会传递任何文件。这也会阻止process.exit()进行任务..

我假设我必须把它包装成某种东西，或者使用替代方法（不是gulp-if）..

Answer 1

gulp-watch是一个无休止的流，所以如果被调用它将永远不会允许进程退出。您的任务始终会调用watch()，以便将其传递给gulpif，即使if不需要它也是如此。这意味着您将运行一个独立的观察者。此外，观察者需要首先在您的管道链中，以便它可以重新触发剩余的处理程序。

您需要做的是使用命令行参数有条件地调用并附加watch()。运行一个观察任务。此外，如果您在观察者之后发生错误，请使用gulp-plumber（https://github.com/floatdrop/gulp-plumber）来保持流的正常工作。

var plumber = require('gulp-plumber');
gulp.task('less', function () {
    var src = gulp.src(['./client/styles/styles.less', './client/styles/libs.less']);

    if (cli.watch) {  // watch() won't be called without the command line arg
        src = src.pipe(watch()).plumber(); 
    }

    return src.pipe(less({ sourceMap: !cli.production }))
        .pipe(gulp.dest('./dist/styles'));
});

Answer 2

不是那么优雅，但这可以基于NODE_ENV（使用gulp-environments引入），我想确定watch的开头（是开发中的是，生产/部署中没有））。免责声明：我刚开始使用Gulp（4.0 beta以便gulp.series正常工作），所以这可能很糟糕，但它完成了工作......： - ）

var environments = require('gulp-environments');
var development = environments.development;
var production = environments.production;

if (development()) {
    gulp.task('default', gulp.series('flow', 'babel', 'cleanup', 'watch'), function(done) {
        done();
    });
}
else {
    gulp.task('default', gulp.series('flow', 'babel', 'compress', 'cleanup'), function(done) {
        done();
    });
}

使用gulp-if（或其他）有条件地启用gulp-watch

2 个答案: