Webpack - 加载块 0 失败

IT技术 javascript reactjs webpack ecmascript-6
2021-04-27 21:23:35

我的一些用户收到此错误:

未处理的拒绝消息:“加载块 0 失败”堆栈:在 HTMLScriptElement.n 上加载块 0 失败

问题是,我没有成功复制它。我有一段时间了这个错误。

每次进入网站时,相同的用户都会发生这种情况但仅限于其中一些。不过都是Win7+Chrome 60,与浏览器无关。

我在网上找不到关于这个特定错误的任何内容。此外,我没有使用 react-router,我确实使用了 react。

任何想法还有什么可能是错的?

可能是由与某些安全相关的事情引起的吗?

我正在使用webpack2.6.1 并CommonsChunkPlugin为我的供应商创建块。

收到错误的用户之一的用户代理:

Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36

4个回答

这样做的原因是因为我使用require.ensurewebpack 创建块并使用jsonp按需添加此脚本,换句话说,它使用创建的块文件将脚本 src 标记添加到 html。

似乎有些用户有扩展甚至一些配置来阻止这样的jsonp请求,不管它是否是同一个域。

一种解决方案是根本不使用require.ensure,或者使用错误回调来处理这种情况。

另外正在寻找一种方式,webpack 将使用 xhr + eval 加载脚本,这将防止这种情况。我刚刚找到了这个 npm module:https : //github.com/elliottsj/xhr-eval-chunk-webpack-plugin,但我希望 webpack 本身能够更多地支持它。

我为此打开了一个问题:https : //github.com/webpack/webpack/issues/5630,希望能看到一些进展。

谷歌搜索的答案:

就我而言,Error: Loading chunk 9 failed.仅在 Firefox 中触发。由正回顾正则表达式引起。(?<=...)

请注意,并非所有浏览器都支持此功能;自行决定使用!

问题可能由以下原因引起:

  • 互联网连接不稳定
  • 错误/格式错误的浏览器缓存

我找到的唯一解决方案是使用此 Webpack 插件重试块加载:https : //github.com/mattlewis92/webpack-retry-chunk-load-plugin

它会:

  • 每秒重试一次加载块。
  • 将添加?cache-bust=X查询以避免(可能格式错误)缓存的 JS 文件。

缺点是 - 它无限期地重新回归。

只需检查将加载块文件(js 文件)的路径。检查 angular.json 文件中 deployURL 的路径。

"build": {
    "builder": "@angular-devkit/build-angular:browser",
    "options": {
      "outputPath": "./Scripts/app",
      "deployUrl": "./Scripts/app/",
      "index": "app/index.html",
      "main": "app/main.ts",
      "polyfills": "app/polyfills.ts",
      "tsConfig": "tsconfig.app.json",
      "aot": false,
      "assets": [
        "app/favicon.ico",
        "app/assets"
      ],