jquery - 为什么 Raven.js/Sentry 说 jQuery 未定义

Question

我在 Sentry 中收到许多错误，提示“ReferenceError:jQuery 未定义”，但与页面加载总数相比，这种情况仍然很少发生。

<script src="/js/compiled/jquery.min-2fe08f7.js" defer></script>
<script src="/js/my-script-e6f35a4.js" defer></script>

其中 my-script.js 类似于:

(function($) {
    $('h1').text('Hello world');
})(jQuery);

但我从 Sentry 报告中不知道为什么 jQuery 没有加载。

Sentry 面包屑中给出的唯一线索非常无用:

12:15:25 sentry ReferenceError: jQuery is not defined
12:15:25 sentry ReferenceError: jQuery is not defined
12:15:26 exception ReferenceError: jQuery is not defined

延迟脚本应该按照它们在文档中出现的顺序加载，所以我认为问题不在于异步加载。

也许 jQuery 文件在某些​​慢速设备上加载超时？或者该文件在某个时刻在服务器上不可用？

这种情况发生在我的各种 JS 文件中，并且还具有各种依赖项，而不仅仅是 jQuery。谁能告诉我如何正确解决此类问题，或者至少将完整的控制台输出发送到 Sentry，包括对 JS 文件等资源的失败的 HTTP 子请求，以找出实际原因是什么？

提前致谢。

Answer 1

您希望将代码包装在一个事件处理程序中，该事件处理程序仅在整个 DOM 准备就绪后才触发，以便保证在加载所有延迟脚本后运行。

通常，如果 jQuery 可用，这将是一个 $(document).ready() 调用，但由于不能保证这一点，我建议在您的 my-script 中执行类似的操作。 js 文件

document.addEventListener("DOMContentLoaded", function(event) {
   (function($) {
     $('h1').text('Hello world');
   })(jQuery);
});