Gulp.js - `watch`没有处理`typescript`更改，但适用于`html，css`更改

Question

我正在使用gulp将date1.getYear() - date2.getYear()文件编译到ts文件中。当我单独更改js文件时，手表不会更新浏览器。但是当我更改ts或html文件时，它工作正常。

我理解，我在css财产中遗漏了一些东西。有人帮我在这里找到错误吗？

这是我的代码：

watch

Answer 1

gulp.watch可能method signatures为：

gulp.watch(glob[, opts], tasks)
gulp.watch(glob[, opts, cb])

所以你在这里做的事情毫无意义：

gulp.watch([[scripts.in], ['typeScript']], browserSync.reload);

这意味着你将'typeScript'作为glob的一部分传递，而它实际上是一个任务名称。

想想你想要实现的目标：

1. 每当您更改scripts.in中的TypeScript文件时，您希望运行typeScript任务，以便将*.ts文件编译为scripts.dest。
2. 每当*.js中生成的scripts.dest文件发生更改时，您都希望执行browserSync.reload回调。

因此，对于TypeScript构建过程的这两个步骤，您实际需要的是两个不同的gulp.watch语句：

gulp.task('default', ['typeScript', 'browserSync'], function () {
  gulp.watch(scripts.in, ['typeScript']);               // 1st step
  gulp.watch(scripts.dest + '*.*', browserSync.reload); // 2nd step

  gulp.watch( ['app/*.html', 'app/styles/*.css'], browserSync.reload);
});