为什么 Chrome 开发者工具/控制台不显示动态加载的 javascript 文件/错误？

Question

我在我的代码中使用require 函数加载文件，该函数将<script/> 标记添加到具有相关属性的页面主体。

脚本加载得很好并且可以访问，但如果其中一个有错误，它永远不会显示在控制台中，而且我没有让它们显示在开发人员工具内的“脚本”选项卡中，基本上剥夺了我的调试能力。

我做错了什么？

我的 require 函数如下所示：

require: function (moduleId) {
    var filename = this.config.modulesDir + '/' + moduleId + '/module.js';
    var script = $('<script></script>').attr({
        'src': filename,
        'type': 'text/javascript'
    }).appendTo('#Scripts');
}

Answer 1

这适用于最新版本的 Chrome (15.0.874.121)。我确实设置了一个 jsfiddle 示例，您可以清楚地看到它有效：

http://jsfiddle.net/Tgax4/

您的问题有两种可能的解决方案：

1. 您的工作站上的 Chrome 不是最新的。更新它。
2. 您需要不存在的脚本，这就是它们未列出的原因。确保您的位置正确。

在第二种情况下，chrome 应该在控制台中告诉您该脚本不存在，所以我很确定它与旧 chrome 版本有关。

Answer 2

您是否考虑过使用像 require.js (http://requirejs.org/) 这样的库来处理您的依赖项？

使用它，我在调试动态加载的脚本时从来没有遇到过问题。

Answer 3

编辑：没关系，那只是 JSFiddle，想要转义斜线。让它逃脱使它对我有用。所以我认为错误不在你的函数中。或许您可以向我们提供更多信息。

---

你可以换一个试试

$('<script></script>')

与

$('<script>')

Answer 4

确保您在 devtools 内的框架中显示脚本。如果你在 iframe 中加载脚本，那么你应该在 chrome 检查器中选择这个框架作为当前环境来显示来自这个框架的脚本。在按钮旁边的 chrome devtools 的左下角是小选择，它使您可以更改当前帧（默认为 ）。尝试选择其他框架并检查脚本是否会显示在脚本选项卡上的脚本选择器中。

如果您看不到错误，请检查底部提到的选择旁边是否选择了正确的日志记录级别 - 尝试选择按钮“全部”，然后检查是否会看到任何错误。