Loading chunk failed, explained and fixed

Bundlers like webpack split an application into chunks loaded on demand, each file named with a content hash. ChunkLoadError: Loading chunk 5 failed means the browser asked for one of those files and did not get it. The classic timing is minutes after a new deployment: a visitor's browser still holds the previous version's HTML, which references chunk files by their old hashes, and the new deployment replaced them. The visitor did nothing wrong and neither, exactly, did the code; the two versions disagree about file names.

If it is happening to you as a visitor

  1. Hard-refresh the page: Ctrl+Shift+R (Windows) or Cmd+Shift+R (Mac) forces the browser to fetch fresh HTML and the current chunk names. This resolves the overwhelming majority of cases.
  2. If it persists, clear the site's stored data (browser settings, site data for that domain) or try a private window; a service worker may be serving the stale shell, and a private window bypasses it.

If it is your application, the causes

  1. Deployments replacing hashed assets: the old HTML outlives the old chunks in browser caches, CDN edges, and open tabs; long-lived single-page sessions are hit hardest because they may run for days.
  2. A wrong publicPath or CDN path in the build, so chunk URLs point somewhere the files were never uploaded; this variant fails for every visitor, including fresh ones, which distinguishes it from the deployment race.
  3. Genuine network failure: the message also appears when the request times out or is blocked; error text includes the URL, and network tooling shows whether the file 404s (version skew) or never completes (network).

Owner-side fixes, in order

  1. Keep old chunks available for a while after deploying: deploy new files alongside the previous build's assets instead of replacing the directory, so stale pages can still resolve their chunk names.
  2. Do not cache the HTML shell: serve the entry HTML with a no-cache or short cache policy while hashed assets get long cache lifetimes; fresh HTML always names current chunks.
  3. Add a recovery path: an error boundary or a window.addEventListener('error') handler that detects ChunkLoadError and reloads the page once (guarded by a session flag so a real outage does not become a reload loop). This converts a stranded visitor into a refreshed one.

Common questions

Why does it start right after a release and then stop? The pool of stale pages drains: visitors refresh, close tabs, or their cached HTML expires. The error rate after a deploy is a measure of how long old HTML and old chunks were allowed to coexist, or not.

Does code splitting cause this? Code splitting creates the chunks; the error comes from version skew between the page and the files, or plain network failure. Apps without splitting cannot hit it, but they pay with one large initial download instead.

A reload fixes it for users, is that acceptable? As a safety net yes, as the only strategy no. Keeping prior assets and uncached HTML removes most occurrences; the reload handler is for the remainder.

Related errors

SyntaxError: Unexpected token · Text content does not match server-rendered HTML · ERR_OSSL_EVP_UNSUPPORTED