当我们使用 gulp.watch() 监听文件变化时，有时候我们会发现它无法正确地处理添加或删除的文件。这个问题可能会导致 gulp 任务不再执行，而必须手动重启任务。
问题原因
gulp.watch() 实际上是使用 Node.js 的 fs.watch() 或者 fs.watchFile() API 来监听文件变化的。但是这些 API 存在一些限制。
- 由于操作系统和文件系统实现的限制，
fs.watch()可能不会监视某些文件或文件夹。 fs.watch()对于某些编辑器（如 Vim）和网络文件系统（如 NFS）可能无法正常工作。fs.watch()和fs.watchFile()在一些情况下会存在性能问题，比如监听大量的文件变化会导致 CPU 占用率增加，应用程序性能下降。
因此，当我们使用 gulp.watch() 监听文件变化时，它可能无法捕获所有新增的或删除的文件。
解决方案
为了解决这个问题，我们可以使用一个叫做 gulp-changed 的插件，它可以仅重新编译修改过的文件，而不是整个项目。
首先安装 gulp-changed：
npm install gulp-changed --save-dev
然后在 gulpfile.js 中引入该插件，并使用它来包装我们的任务。例如：
-- -------------------- ---- -------
----- ---- - ----------------
----- ------- - ------------------------
--------------- ---------- -
------ -----------------------
-------------------------
----------------------------
---
------------------ ---------- -
------------------------- -------------------
---在这个示例中，gulp-changed 插件会检查源文件和目标文件夹中的文件差异，只重新编译被修改过的文件。
总结
使用 gulp.watch() 监听文件变化时，可能无法正确地处理添加或删除的文件。为了解决这个问题，我们可以使用 gulp-changed 插件，它可以仅重新编译修改过的文件，而不是整个项目。这将提高应用程序的性能，并减少手动重启任务的需要。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/9830
