为什么Raven.js/Sentry说jQuery没有定义

Question

我在哨兵中遇到很多错误，说"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);

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

哨兵面包屑中给出的唯一线索是毫无用处的：

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);
});