我可以使用webpack-dev-server热服务index.html吗？

Question

我启用了--hot的webpack-dev-server，对于Javascript文件来说效果很好。如果我：

• 使用代码/src/someFile.js
创建document.write("Foo");
• 将<script>引用/src/someFile.js添加到我的index.html
• 将/src/someFile.js更改为document.write("Bar");
• 我的浏览器立即更新以显示“Bar”而不是“Foo”

但是，如果我的<p>Foo</p>文件中有index.html，并将其更改为<p>Bar</p>，我就看不到更改。如果我刷新页面，我确实看到了变化，所以我知道webpack正在服务index.html;当我保存文件时，它不会热插拔它。

有谁知道如何修复webpack-dev-server以自动更新我的HTML以响应文件更改？

Answer 1

This solution应该像你的魅力一样。在您的示例中，步骤为：

1. npm install --save-dev raw-loader

2. 将此添加到您的webpack.config加载器部分...

   {
     test: /\.html$/,
     loader: "raw-loader"
   }
   

3. 在require('index.html');的顶部添加/src/someFile.js行。

基本上，您只是让webpack知道index.html，以便它监视更改。这只是对您的特定问题的快速解决方案，但对于任何对更深入的“感兴趣”的人来说都是如此。该解决方案参考上面链接的更全面的解释。