gulp watch 延迟答案

【问题标题】：Delay in gulp watchgulp watch 延迟
【发布时间】：2017-06-07 12:21:26
【问题描述】：

目前我正在使用真正的 ftp 并在 te 服务器上运行 gulp watch，现在问题是当我的 gulp watch 检测到更改时，文件还没有准备好上传，所以我需要延迟我的 gulp watch。

gulp.task('watch', function() {
  setTimeout(function() {
    gulp.watch(config.js.app.pathIn + '/**/*.js', ['js_app']);
    gulp.watch(config.js.vendor.pathIn + '/**/*.js', ['js_vendor']);
    gulp.watch(config.scss.pathIn + '/**/*.scss', ['scss']);
  }, 3000);
});

这不是延迟文件的渲染，如何确保渲染文件时有延迟？

【问题讨论】：

标签： gulp gulp-watch

【解决方案1】：

在 Gulp 4 中，gulp.watch 接受一个选项对象，其中包括 define a delay：

gulp.watch( someGlob, { delay: 500 }, someTask );

细则：

延迟仅适用于作为参数传递给gulp.watch 的任务函数。它确实对在gulp.watch 的返回值上设置的事件处理程序有任何影响。换句话说，在

的选项中设置了 delay

gulp.watch( globs, options, taskFunction );

有效，但是

let watcher = gulp.watch( globs, options ); 
watcher.on( "change", callback );

忽略options.delay。

这是因为gulp.watch 返回一个chokidar 的实例，它不知道gulp.watch 特有的选项（例如delay 或queue）。

如果您需要延迟特定事件的监视任务，请改为使用events 选项进行设置：

gulp.watch( globs, { events: ["add", "change"], delay: 500 }, taskFunction );

event 选项目前缺少 in the Gulp 4 docs，但您可以在提供监视功能的组件 documentation of glob-watcher 中找到它。

【讨论】：

【解决方案2】：

Gulp-wait 看起来对你有用。将其插入三个任务的顶部。

gulp.task('watch', function() {
   gulp.watch(config.js.app.pathIn + '/**/*.js', setTimeout(function() {
     gulp.start('scss')
  }, 3000)
});

可能如果你想要一个 setTimeout 方法但它使用 gulp.start - 从 gulp4.0 中删除。如果您使用 gulp4 并在此处对您的任务而不是 gulp.start 进行函数调用，则容易得多。

但我建议 gulp-wait。

【讨论】：