webpack-dev-server的缓存问题

Question

我在运行webpack-dev-server时遇到了一些问题。每当我保存一个文件并且更改已被编译时，它们不会在浏览器中反映出来。（命令行没有错误）

我正在运行以下命令：

webpack-dev-server --progress --color 但是，如果我每次有更改就运行webpack，这将反映在我的浏览器中。

我在Mac上运行Chrome（最新的OSX版本），并启用了“开发工具打开时禁用缓存”选项。不用说，但是嘿-你永远不知道，我已经打开了我的开发工具：）

我错过了简单的步骤吗？

- Nicklas Pouey-Winger

---

你是否将观察目录附加到webpack-dev-server中，例如webpack-dev-server --progress --color /your-project-to-watch？ - 4m1r

@4m1r 不，我还没有这样做过。我正在观看Pluralsight课程，作者让它工作了。（并不是说他的方法是正确的）。我会尝试一下！ - Nicklas Pouey-Winger

Answer 1

为了禁用缓存，我在webpack配置中使用了Cache-Control头部。[Cache-Control]

devServer: {
  headers: {
    'Cache-Control': 'no-store',
  },
},

- Sahil Raj Thapa

Answer 2

我曾经遇到过同样的问题，当时在我的html文件中使用了dist/app.js文件而不是由webpack-dev-server生成的app.js文件。

在我的html文件中使用以下代码解决了这个问题：

<script src="vendor.js"></script>
<script src="app.js"></script>

- jcubic

Answer 3

我必须直接将我的脚本标签指向带有完整URL的webpack-dev-server，就像这样：

<script src="http://localhost:8080/vendor.bundle.min.js"></script>
<script src="http://localhost:8080/app.bundle.min.js"></script>

- thargenediad