javascript - Chrome 开发者工具缓存旧版本的 JavaScript 文件

Question

我遇到了一个奇怪的间歇性问题，Chrome 开发者工具卡在旧版本的 JavaScript 文件上。我将开发一些 JS 应用程序，发现一切都在嗡嗡作响，然后突然间我的 JavaScript 文件将从“源”选项卡上的 JavaScript 文件列表中消失。这是我发现有问题的第一个线索。

我最终发现，Chrome 开发者工具显然依赖于旧版本的 JavaScript 文件。 Chrome 本身正在向服务器请求并执行最新版本，但您无法调试 JavaScript 文件。

我通过获取从我的源列表中消失的特定 JavaScript 文件并将其替换为一行 console.log 来向自己“证明”这就是正在发生的事情。声明。

然后我重新加载页面，并注意到 console.log 语句出现在 JavaScript 控制台中。我还在网络选项卡中注意到 JavaScript 文件已成功检索，并且通过网络传输的内容仅包含一行 console.log。声明。

但是，JavaScript 文件仍然没有出现在源列表中，如果我在控制台中单击文件名(它出现在控制台的右侧，记录的语句旁边)，然后我跳转到源选项卡，打开旧版本的 JavaScript 文件。

此 JavaScript 文件通过常规 <script> 加载到页面上标签。它不是通过另一个脚本或通过 eval 动态加载的。只是一个普通的 Vanilla <script>指向网络服务器上的 .js 文件的标记。

我试过:

1. 确保在 DevTools 设置中选中“禁用缓存(当 DevTools 打开时)”。
2. 手动清除我在 Chrome 中的缓存和 cookie。
3. 重新启动 Chrome
4. 在单独的 Chrome 标签页中手动加载 JavaScript 文件
5. 禁用我安装的所有 Chrome 扩展程序/应用
6. 以隐身模式运行页面
7. 取消选中“启用 JavaScript 源映射”和“启用 CSS 源映射”

这些都没有改变行为。你可以watch a video demonstrating this here ，如果你不相信我的话!

我确实认为这是 Chrome 的问题，因为我可以使用 Firefox 而不会出现这个问题……但我真的很喜欢 Chrome 和 Chrome 的开发者工具:-) 所以我想让它在 Chrome 中工作……

更新 我将此报告为 Chrome 错误 here .如果此错误正在影响您或对您很重要，请对其进行投票和/或添加包含其他信息的评论。

Answer 1

Chrome DevTools 对我来说效果很好。当我为一个页面加载它时，它会记住在 chrome 进程的生命周期之外我打开了哪些资源；尽管它弄错了顺序。我在我们的 devtools 首选项中看到两个不同之处:禁用缓存和启用 map 。所以我建议:

1) 取消选中禁用缓存(当 DevTools 打开时)， 2)(如果 1 不起作用)按“恢复默认值并重新加载”按钮。