Chrome/Edge开发者工具在“Sources”选项卡中不显示源代码，除非刷新页面。

Question

我查看了许多关于这个问题的问题和答案，但是没有一个答案谈到了问题的根本原因以及如何永久解决它。

当我打开 Google Chrome 或 Edge 浏览器中的任何选项卡的开发者工具并检查 Sources 选项卡时，默认情况下不会显示源代码（JavaScript/Script）。但是，如果我在 Developer Tools 仍然打开的情况下刷新页面，则它开始显示源代码。

我不知道在哪里以及如何修复这种行为。之前，当我打开 Developer Tools 时，它会在 Sources 选项卡下正常显示源代码，而无需刷新整个页面。

以下是一些屏幕截图，以帮助更好地理解我的意思：

1. 当我打开开发者工具时，Sources 选项卡（在刷新页面之前）。即使我双击文件名，它也不会显示源页面，除非我刷新整个页面。

2. 刷新页面后的 Sources 选项卡

编辑：以下是开发者窗口中的当前设置，以帮助识别问题：

- SavindraSingh

---

我正在使用Google Chrome版本96.0.4664.45（官方构建）（64位）。还有Microsoft Edge版本95.0.1020.40（官方构建）（64位）。 - SavindraSingh

如果有帮助的话，已添加了“首选项”设置的截图。 - SavindraSingh

首选项设置看起来没有问题。我看到你在调试本地主机页面，这个问题是否也发生在其他公共页面上？如果是的话，我认为你可能遇到了这个问题。由于这是在Chromium浏览器中发生的，我建议你可以在这个论坛上提交一个问题。 - Yu Zhou

当我打开公共页面的源代码（例如此页面）时，虽然默认情况下不会显示源代码页面，但如果我从左侧菜单双击页面文件，仍然会显示源代码。 - SavindraSingh

你说得对，根据你提到的论坛，这似乎是一个已知问题。我还尝试在首选项设置中禁用了“启用JavaScript源映射”，但没有起到作用。 - SavindraSingh

Answer 1

我曾经遇到过类似的问题，我一直在我的代码中逐步删除部分，直到它能够正常工作，结果发现是因为我使用了JavaScript风格的注释块。请参考这里的链接：https://stackoverflow.com/a/76834779/7250354

- andrew hughes

Answer 2

在你的代码中添加一个console.log，然后当你的console.log在控制台窗口中显示时运行页面，然后点击右侧的行号，它将强制打开源文件，我有过这样的经历 ;) 开心调试。

- Ravi Padhi