来自 webpack 的模块 [moduleId] 在 Firefox Quatum 58.0b16 中未定义

modules[moduleId] from webpack is undefined in Firefox Quatum 58.0b16

我的产品环境中的 webpack 在以下行中收到一个奇怪的错误,仅在 FF 上。我试过 Chrome,Safari 没有问题。

function __webpack_require__(moduleId) {

    ...

    // Execute the module function
    modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
}

如果我在该行中断并重新加载页面,问题就不会发生,这让我认为这是加载文件的某种竞争条件。

我有 4 个 webpack 输出文件,顺序如下。

<script type="text/javascript" src="/manifest-4.e05278c43f895122ca44.js" async=""></script>
<script type="text/javascript" src="/vendor-2.e05278c43f895122ca44.js" async=""></script>
<script type="text/javascript" src="/main-0.e05278c43f895122ca44.js" async=""></script>
<script type="text/javascript" src="/bootstrap-3.e05278c43f895122ca44.js" async=""></script> 

我查看了 Github & SO 以了解类似问题,但认为它们与我的问题没有直接关系。

[更新]

已将确切的 moduleId 调试为 49。第 49 个模块的主包文件内容为空,这意味着它必须在供应商包中。怀疑 main 和 vendor bundle 的加载速度可能会导致一些问题。

自己想出了答案。

正如所怀疑的那样,这是因为供应商包在主包之后加载。尽管在 main 之前指定了 vendor bundle,但有几个原因导致了这种情况。

  1. async 属性在获取包时可能会导致竞争条件
  2. 除了 async 我们也是 preloading 主要捆绑包

我们删除了两者,因为我们对它们没有任何用处。