requireJS 何时完成加载所有模块

Question

我想等待我的所有 requireJS 模块完成加载，然后再触发事件。是否有事件或方法来监听我所有的 requireJS 模块以完成加载？

详情：

我正在尝试向我的 Google 分析添加自定义维度，然后发送综合浏览量。如果我设置相同的尺寸，这在所有页面上都很容易做到，但在我的一些 requireJS 模块中，我想在页面视图之前更改尺寸。

我有我的模板 javascript，它在每一页上都是运行，我希望它这样做：

LISTEN_FOR_MODULES_TO_LOAD(function() {
  $(document).trigger('set-your-analytics-dimensions-yall');
  ga('send', 'pageview');
});

然后在我的一些子页面上我有模块在做：

$(document).on('set-your-analytics-dimensions-yall', function() {
  ga('set', 'dimension');
});

我希望流程是：

监听我所有的模块以完成加载
要求其他模块设置它们的维度和其他值
设置综合浏览量

问题是我无法监听所有要加载的 requirejs 模块。

我考虑过的事情：

DOM 准备就绪

这不起作用，因为 DOM Ready 可以在所有 JavaScript 模块加载之前或之后触发。

window.onload

这不可靠，可以触发多次。如果 10 分钟后将图像添加到页面，它会再次触发。如果外部资源从不加载此事件将永远不会触发。

是否有我遗漏的选项？或者我完全错过了 requireJS 的东西？

Answer 1

这个问题已经有两年多了，但这是我遇到同样问题时在 SO 上发现的唯一相关问题。我最终找到了适合我的答案。这是一些背景：我有一个动态生成的页面，其中包含多个不同数量的页面部分，其中可能包括 require.js 加载的模块。例如，想象一个带有可变数量图块的页面，每个图块都可以使用 require 加载脚本。现在，当所有图块都已加载后，我想运行一些其他 javascript。但是你怎么知道 require.js 什么时候完成加载所有内容，包括可以作为子模块加载的模块？

查看 require.js 代码，我看到它包含一个注册表，它似乎是一个挂起加载及其回调的列表。因此，当注册表为空时，require.js 完成加载并完成运行ning 回调。至少看起来是这样，这对我有用。基本上在页面底部（在对 require() 的任何其他调用下方），我添加了这个 javascript:

function run_final_action($) {
    if ($.isEmptyObject(require.s.contexts._.registry)) {
        do_final_action();
    }
    else {
        setTimeout(run_final_action, 100);
    }
}
require( ['jquery'], function ($) { run_final_action($) } );

我在这里使用 jquery 因为我已经在页面中加载了它，但这并不是必需的。基本思想只是检查 requirejs 中的默认上下文（名为“_”）的注册表，当它为空时，这意味着 requirejs 没有待加载的脚本或回调运行。这无论如何都适用于我的用例。

requireJS 何时完成加载所有模块

When is requireJS done loading all modules

javascript

google-analytics

requirejs