Watchify 可以提取对 html 文件的更改吗？

Question

我使用 babel-plugin-transform-html-import-to-string.

将 html 模板文件导入到我的 javascript 组件中

当我使用 watchify 时，如果 html 已更改，它不会更新。只有 Javascript 个文件更改。 npm 脚本是这样的：

watchify -p browserify-hmr -t [babelify ext .js .html] src/index.js -o public/bundle.js

由于这不起作用，我改用手表，如下所示，但我的构建比以前即时构建时至少慢了 5 秒。

watch 'npm run browserify' src/ -d --interval=1 browserify脚本在哪里 browserify -t [babelify ext .js] src/index.js -o public/bundle.js

有人知道我如何运行对 html 文件更改进行浏览器验证而不牺牲快速重建吗？

Answer 1

问题是 browserify 从来没有看到对 .html 文件的引用，因为 babelify 正在用变量和 HTML 字符串替换它们。

如果你想让 watchify 监视 .html 文件并在它们发生变化时重建包，你应该允许 babelify 转换语句，如 import some from './some.html' 到 var some = require('./some.html') 并且应该使用browserify-based变换（likestringify）变换需要的内容：

watchify \
  -p browserify-hmr \
  -t [babelify ext .js] \
  -t [stringify ext .html] \
  src/index.js -o public/bundle.js

Browserify/watchify 将看到 .html 文件包含在捆绑包中，并将观察它们的变化。

Watchify 可以提取对 html 文件的更改吗？

Can Watchify pick up changes to html files?

html

javascript

browserify

watchify