gulp.watch 运行保存多个文件时多次执行同一任务

Question

有没有办法在多个监视文件更改时将 gulp.watch 配置为运行任务一次？我的任务设置如下：

var bs = require('browser-sync').create();

module.exports = function (gulp, plugins, config) {
  return function watch() {
    gulp.watch( 

      config.source.javascript, 
      // {debounceDelay: 500}, 
      gulp.series('js', 'wp', bs.reload) 

    );
  };
};

..当我一次保存多个观看文件时（在文本编辑器中保存所有），我的gulp.series（我正在使用gulp 4.0) 每个更改的文件任务运行一次。有没有办法改变这个并使 gulp.watch 运行 gulp.series 任务只执行一次？

谢谢..

Answer 1

我添加了一个 'buffer' 函数，如下所示：

var reload = false;
var delay = 500;

function brsync_reload(done) { brsync.reload();                 queue_reset(done); }
function brsync_stream(done) { brsync.reload({ stream: true }); queue_reset(done); }

function queue_reload() { gulp.series(gulp.queue.concat(brsync_reload))(); }
function queue_stream() { gulp.series(gulp.queue.concat(brsync_stream))(); }
function queue_reset(done)  { gulp.queue = []; reload = false; done(); }

function queue_tasks(tasks, last) {
  reload = reload || last == brsync_reload;
  gulp.queue = gulp.queue || [];

  if (gulp.queue.length == 0)
    setTimeout(reload ? queue_reload : queue_stream, delay);

  gulp.queue = gulp.queue
    .concat(tasks.filter(task => !gulp.queue.some(queued => queued == task)));
  // console.log(gulp.queue);
}

brsync.init(CONFIG.BRSYNC);

gulp.watch(CONFIG.SRC.JAVASCRIPT,     () => queue_tasks(['javascript'], brsync_reload));
gulp.watch(CONFIG.SRC.STATIC,         () => queue_tasks(['static'], brsync_reload));
gulp.watch(CONFIG.SRC.STYLES,         () => queue_tasks(['styles'], brsync_stream));
gulp.watch(CONFIG.SRC.TYPESCRIPT,     () => queue_tasks(['typescript'], brsync_reload));

现在，当我更改一个文件时输出是：

[21:40:17] Starting '<anonymous>'...
[21:40:17] Starting '<anonymous>'...
[21:40:18] Starting 'typescript'...
[21:40:21] Finished 'typescript' after 3.16 s
[21:40:21] Starting 'brsync_reload'...
[21:40:21] Finished 'brsync_reload' after 2.73 ms

...当我更改 3 个文件（2x 打字机，1x 手写笔）时，输出为：

[21:41:19] Starting '<anonymous>'...
[21:41:19] Starting '<anonymous>'...
[21:41:19] Starting '<anonymous>'...
[21:41:19] Starting '<anonymous>'...
[21:41:19] Starting '<anonymous>'...
[21:41:19] Starting '<anonymous>'...
[21:41:20] Starting 'typescript'...
[21:41:22] Finished 'typescript' after 2.02 s
[21:41:22] Starting 'styles'...
[21:41:23] Finished 'styles' after 1.82 s
[21:41:23] Starting 'brsync_reload'...
[21:41:23] Finished 'brsync_reload' after 1.92 ms

效果很好，只有这些匿名函数的日志很烦人 (;

gulp.watch 运行保存多个文件时多次执行同一任务

gulp.watch running same task multiple times when saving many files

gulp

gulp-watch

gulp.watch 运行 保存多个文件时多次执行同一任务

gulp.watch running same task multiple times when saving many files

gulp

gulp-watch

gulp.watch 运行保存多个文件时多次执行同一任务