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其中watch 'npm run browserify' src/ -d --interval=1腳本是browserify -t [babelify ext .js] src/index.js -o public/bundle.js

任何人都知道如何在不犧牲快速重建的情況下在html文件更改上運行browserify？

Answer 1

問題是browserify永遠不會看到對.html文件的引用，因為babelify正在用變量和HTML字符串替換它們。

如果你想讓watchify觀看.html文件並在它們發生變化時重建包，你應該允許babelify轉換語句，例如import some from './some.html'到var some = require('./some.html')和應使用browserify基於變換（像字符串化 ）來轉換所要求的內容：

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

然后，Browserify / watchify會將.html文件視為包含在包中，並會查看它們的更改。