javascript - 不确定 BrowserSync 主页上给出的示例

Question

考虑这个example BrowserSync + Gulp 页面上有关浏览器重新加载的信息，特别是这部分:

// use default task to launch BrowserSync and watch JS files
gulp.task('default', ['browser-sync'], function () {

    // add browserSync.reload to the tasks array to make
    // all browsers reload after tasks are complete.
    gulp.watch("js/*.js", ['js', browserSync.reload]);
});

由于任务依赖项是异步运行的(此处:js 和 browserSync.reload)，重新加载不会在 js 任务之前完成吗？

Answer 1

是的，根据文档，这是有可能的。

在同一页面上...

 (make sure you return the stream from your tasks to ensure the browser is reloaded at the correct time)

如果它是一个异步任务，它只会触发并且不会返回任何内容，并且观察者将不知道刷新。或者它可能会在该过程完成之前重新加载。

为了解决这个问题，您应该向您的任务添加回调。

gulp.task('somename', function() {
  var stream = gulp.src('client/**/*.js')
    .pipe(minify())
    .pipe(gulp.dest('build'));
  return stream;
});

只需返回流，这样 Gulp 就知道发生了什么。然后为您想要的任务设置 watch :

gulp.task('default', ['browser-sync'], function () {
  // Watched tasks are run in parallel, not in series.
  gulp.watch(['*.js'], ['somename', browserSync.reload]);
});

这全部包含在文档中:

https://github.com/gulpjs/gulp/blob/master/docs/API.md#async-task-support