gulp watchify 需要两次保存才能包含更改

Question

一段时间以来一直在尝试使用 watchify，但我在保存时遇到了问题。

似乎对于我所做的每一个更改，我都需要保存两次才能将更改应用到输出中。

如果我在任何 js 文件中添加代码，新添加的代码只会在任务运行两次时显示。

我的 mainScrpits-task 代码

var customOpts = {
      entries: ['./app/app.js'],
      debug: true
    };
    var opts = assign({}, watchify.args, customOpts);
    var b = watchify(browserify(opts));


    gulp.task('mainScripts', bundle);
    b.on('update', bundle);
    b.on('log', gutil.log);

    function bundle() {
      console.log('bundle');
      return b.bundle()
        .on('error', gutil.log.bind(gutil, 'Browserify Error'))
        .pipe(source('main.js'))
        .pipe(buffer())
        .pipe(gulpif(!condition, sourcemaps.init({
          loadMaps: true
        })))
        .pipe(gulpif(!condition, sourcemaps.write('./')))
        .pipe(gulp.dest('./dist/js/'))
        .pipe(gulpif(isLocal(), connect.reload()));
    }

“监视”任务

gulp.task('watch', function() {
  gulp.watch('app/**/*.js', ['mainScripts']);
});

Answer 1

watchify 和 gulp.watch 都在寻找您的文件的更改，这会导致创建包时出现竞争条件。

您的监视任务应该只是启动您的 mainScripts 任务：

gulp.task('watch', function() {
  gulp.start('mainScripts');
});