最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - Webpack - Loading chunk 0 failed - Stack Overflow

programmeradmin0浏览0评论

Some of my users are getting this error:

Unhandled rejection message: 'Loading chunk 0 failed' stack: Loading chunk 0 failed at HTMLScriptElement.n

The problem is, I've no success in reproducing it. and I've this error for some time now.

It occurs to the same users, every time they enter the website. but only to some of them. Yet, all of them are using Win7 + Chrome 60, so it's not related to the browser.

I could not find anything on the web regard this specific error. In addition I'm not using react-router, I do use react.

Any ideas what else could be wrong?

Could it be caused by something related to some security?

I'm using webpack 2.6.1 and CommonsChunkPlugin to create chunk for my vendors.

The user agent of one of the users getting the error :

Mozilla/5.0 (Windo­ws NT 6.1; Win64; x6­4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36

Some of my users are getting this error:

Unhandled rejection message: 'Loading chunk 0 failed' stack: Loading chunk 0 failed at HTMLScriptElement.n

The problem is, I've no success in reproducing it. and I've this error for some time now.

It occurs to the same users, every time they enter the website. but only to some of them. Yet, all of them are using Win7 + Chrome 60, so it's not related to the browser.

I could not find anything on the web regard this specific error. In addition I'm not using react-router, I do use react.

Any ideas what else could be wrong?

Could it be caused by something related to some security?

I'm using webpack 2.6.1 and CommonsChunkPlugin to create chunk for my vendors.

The user agent of one of the users getting the error :

Mozilla/5.0 (Windo­ws NT 6.1; Win64; x6­4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.113 Safari/537.36

Share Improve this question edited Sep 6, 2017 at 7:05 jony89 asked Sep 5, 2017 at 9:37 jony89jony89 5,3673 gold badges33 silver badges42 bronze badges 4
  • Maybe your users are using an extension that block the requests, or a firewall? – Tr1et Commented Sep 5, 2017 at 10:26
  • Maybe, I was thinking also that since webpack is doing actually jsonp - script src injection, and if the user has some high security settings, then it is blocked. (although it is the same domain) or some firewall.. – jony89 Commented Sep 5, 2017 at 10:59
  • I'm running into this same issue, but when using dynamic imports (and named chunks). Cannot replicate but a handful of users are periodically getting this error. – Jakemmarsh Commented Sep 5, 2017 at 20:20
  • @Jakemmarsh see my answer, You can upvote my issue in webpack – jony89 Commented Sep 5, 2017 at 21:37
Add a comment  | 

5 Answers 5

Reset to default 5

The reason for this is because I used require.ensure with webpack which creates chunks and using jsonp to add this script on demand, in other words, It's adding script src tag to the html with the created chunk file.

It seems that some users have extensions or even some configuration to block such jsonp requests regardless whether it's the same domain or not.

One solution is not using require.ensure at all obviously, or using the error callback to handle this scenario.

In addition was looking for a way that webpack will load the script using xhr + eval, which will prevent such scenarios. I just found this npm module: https://github.com/elliottsj/xhr-eval-chunk-webpack-plugin, yet I expected it to be more supported by webpack itself.

I've opened an issue for this : https://github.com/webpack/webpack/issues/5630, hopefully to see some progress.

Answer for search from google:

In my case Error: Loading chunk 9 failed. fired only in Firefox. Caused by positive lookbehind regexp. (?<=...)

Note that this feature is not yet supported on all browsers; use at your own discretion!

The problem can be caused by:

  • Unstable internet connection
  • Wrong/malformed browser cache

The only solution I found is retry the chunk load with this Webpack plugin: https://github.com/mattlewis92/webpack-retry-chunk-load-plugin

It will:

  • Retry loading the chunk once a second.
  • Will add ?cache-bust=X query to avoid (probably malformed) cached JS file.

The downside is - it reties indefinitely.

Just check for path which going to load your chunks file(js files). Check path of deployURL in angular.json file.

"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"
      ],

If you are on Cloudflare, or any CDN host for your web server, try purging the cache as this may be caused by caches from the old version of your app. It fails as the new build does not correspond to the old one.

发布评论

评论列表(0)

  1. 暂无评论