gulp - 使用 gulp-watch 创建正常的 "build"任务，而无需重复任务

Question

过去，我使用 gulp.watch 创建一个在开发过程中使用的“监视”任务。在“监视”任务中，我将有一个单独的监视，它可以运行所需的任何内容。例如:

gulp.task("watch", function () {
    gulp.watch("**/*.js", ["js"]);
    gulp.watch("**/*.less", ["less"]);
});

然后是一个“构建”任务，它将一起运行所有内容:

gulp.task("build", ["js", "less"]);

效果很好，只不过这意味着在一次更改时需要重新编译很少的文件，或者在一次更改时需要重新编译每个 JS 文件。

我已经改用gulp-watch，所以我现在可以让它进行增量构建。我现在不再有“观看”任务，而是有如下所示的任务:

gulp.task("less", function () {
    return gulp.src("**/*.less")
        .pipe(watch("**/*.less"))
        .pipe(less())
        .pipe(gulp.dest("dist"));
});

这对于增量构建非常有用，但现在我无法找到一种干净的方法来执行“构建”任务，该任务仅在不进入监视模式的情况下进行构建，以进行诸如部署之类的事情。

问题:是否有一种标准/干净的方法可以让我创建“构建”任务，而无需观看，而无需基本上重复我的所有任务？

Answer 1

我最终提出的解决方案是使用全局debug值，通常设置为true，但是build任务将其设置为 false。然后，在任务中，仅当 debug == true 时，watch 才会添加到管道中。

示例:

var gulp = require('gulp'),
    runSequence = require('run-sequence'),
    watch = require('gulp-watch');
var debug = true;

gulp.task('copy', function () {
    var task = gulp.src('**/*.js');

    debug && task.pipe(watch());

    task.pipe(gulp.dest('dist'));
});

gulp.task('build:dev', ['copy']);

gulp.task('build', function (cb) {
    debug = false;
    runSequence('build:dev', cb);
});

如果我运行build:dev，它将运行copy并将副本置于监视模式，因为监视是通过管道传输的，因为全局debug 值为 true。

如果我运行build，它会将全局debug值设置为false，因此 watch 不会通过管道传输，这意味着它将直接做任务，不看。

我还可以添加仅用于 debug == false 的内容(例如，丑化)。

这不是 super 干净，也不太符合 gulp 哲学，但它工作得相当好，所以我对它很满意。

========

Gulp 4.0 更新

我最近开始使用 Gulp 4.0，现在你不能使用 runSequence (或者至少，它是多余的)，所以你不能设置变量然后调用 runSequence。我最终所做的是创建一个名为“debug:off”的任务，我在构建链的开头调用它:

var gulp = require('gulp');
var debug = true;

gulp.task('debug:off', function (cb) { 
    debug = false;
    cb();
});

// ...

gulp.task('build:dev', gulp.parallel('task1', 'task2'));
gulp.task('build', gulp.serial('debug:off', 'build:dev'));

另一种方法是不使用这样的变量，您还可以在运行 Gulp 时设置一个环境变量。适用于所有版本的 Gulp。

// gulpfile.js
var debug = process.env.PROD

// command-line, debug mode
$ gulp

// command-line, prod mode
$ PROD=1 && gulp

环境变量不是我的偏好，但其他人似乎更喜欢它而不是使用任务来配置变量。