Question

我看到控制台日志语句，一旦我更改了任何javascript文件，js任务就会运行两次。我想知道为什么每次更改会运行两次？

var gulp = require('gulp');
var concat = require("gulp-concat");
var uglify = require("gulp-uglify");

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

gulp.task("js", function(){
    var js = [
        "public/js/**/*.js",
        "!public/js/api/**/*.js"
    ];

    gulp.src(js)
    .pipe(concat("app.min.js"))
    .pipe(uglify())
    .pipe(gulp.dest("public/js"));
});

控制台

[13:02:27] Starting 'js'...
[13:02:27] Finished 'js' after 1.6 ms
[13:02:27] Starting 'js'...
[13:02:27] Finished 'js' after 5.1 ms

Answer 1

问题是您正在查看在检测到更改时运行的任务中用作目标目录的同一目录。目前，您的构建流程如下所示：

想象一下您正在修改文件 public / js / script.js 。
监视任务检测到更改并启动自定义 js任务。结果，创建了 public / js / app.min.js 文件。
由于 app.min.js 位于监视目录内，因此监视任务会检测到另一个更改，因此再次执行 js任务。你实际上应该遇到一个循环，但Gulp似乎足够聪明，可以检测到这样的循环。

此问题的最佳解决方案是将源文件与输出分开。在任务管道中，将目标文件夹设置为源目录之外的内容，例如：

.pipe(gulp.dest("dist/js"));

之后，您的项目应具有以下结构：

public
  js
    script.js
dist
  js
    app.min.js
grunfile.js
...

public 目录用于保存被监视的源文件， dist 目录保存构建的输出。如果我是你，我会重新考虑将公共目录重命名为更具描述性的内容，例如 src ，但这取决于你：）

Gulp js为观察声明跑了两次

1 个答案: