ChunkLoadError: Loading chunk * failed.

Picture from webix

Uncaught SyntaxError: Unexpected token ‘<’
ChunkLoadError: Loading chunk <random text> failed.

If you are using Vue/Angular/React and other modularizable UI frameworks with webpack, you will eventually encounter this error at a certain point in time.

🔏 Solution:

🖨 Isn’t this error frustrating? :-) If you are a developer you will soon realize in the year 2021, do we still need to address this? — Yes.

🏇 So what’s causing this?

Take an example route definition:

1. The comment in the above route webpackChunkName:testOneView will produce minified js and map file into its “dist” on npm build before serving.
2. The problem arises when this file is updated with its latest build and the browser cached file is different which is being requested and loaded earlier.

So, on such errors catch them and trigger a “serviceworker” update or reload the page, which automatically resolves files for.

Find other articles @ my publication: ThinkSpecial