javascript - 为什么调试器中包含两次 React 源代码？

我“继承”了create-react-app我正在更新一些功能的 a 。我熟悉 JS 并且可以在 React 中编码，但我对 webpack、npm、热重载或其他简化开发人员生活的过程知之甚少。

不幸的是，在尝试调试此应用程序时，调试器不会在断点处停止，无论是在 Chrome 还是在 Firefox 中。这个答案表明当脚本出现两次时会出现问题。事实上，在我的 Firefox 中，其中一个页面被加载了两次：

显然，它们不能同时存在于同一目录中。但由于某种原因，浏览器会显示并可能同时运行两者。

我如何识别它们的来源并禁用它，以便重新控制我的调试器？我相信它与 webpack、热重载和源映射有关。

编辑：如果我重新启动 Firefox，那么一切都很好，只有一份源代码。但是，在我修改文件并且页面自动刷新后，我又得到了 2 个副本。因此，对于这种热重载显然有些可疑...

标签： javascriptfirefoxwebpackgoogle-chrome-devtoolscreate-react-app

这似乎是浏览器缓存旧版本的问题。

我还注意到只有一个版本会在断点处停止，而另一个版本会忽略它们。

这篇文章向您展示了哪个文件被缓存，哪个是真实的：https ://stackoverflow.com/a/53877858/373207

在提供 js 文件的服务器中应该可以禁用缓存。对于 create-react-app 这可以通过将启动命令更改为：

react-scripts start --no-cache