javascript - webpack 中的 module[moduleId] 在 Firefox Quatum 58.0b16 中未定义

标签 javascript firefox webpack firefox-quantum

我在我的产品环境中的 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 个模块的主捆绑文件内容为空,这意味着它必须位于 vendor 捆绑中。怀疑主包和 vendor 包的加载速度可能会导致一些问题。

最佳答案

我自己找到了答案。

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

  1. async 属性可能会在获取 bundle 时导致竞争条件
  2. 除了async之外,我们还preloading主包

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

关于javascript - webpack 中的 module[moduleId] 在 Firefox Quatum 58.0b16 中未定义,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48276817/

相关文章:

javascript - Firefox - 记录 ionmonkey 编译和救助

javascript访问网络面板信息

html - 如何在没有无效 CSS3 代码的情况下解决 Firefox 边框错误

reactjs - 图片: You may need an appropriate loader to handle this file type

image - Webpack4 : Moving/Importing Image Folder from "SRC folder" to "DIST folder"

angular - HttpHeaders.applyUpdate 'Cannot read property ' 长度'未定义' Angular 通用服务器

javascript - React-testing-library 为什么 toBeInTheDocument() 不是一个函数

JavaScript 触发的 UpdatePanel 未正确更新

javascript - Angular Directive(指令) : return object from collection

javascript - jQuery 和 ASP.Net 资源和陷阱