0

Recently I have noticed that my PWA is no longer working on my Chrome 85.0.4183.127 on Android 10. I use code splitting using React lazy() load and Webpack 4.

When navigating to a lazy loaded resource my installed PWA on Android 10 reports

ChunkLoadError: Loading chunk 0 failed.
(missing: https://example.com/0.bundle.js)

The location for the 0.bundle.js in the above error message is incorrect. The correct path /dist/0.bundle.js is defined in index.js and serviceWorker.js but Chrome seems to be looking in the root. I have cleared the cache and updated the service worker to no avail.

When installing the PWA on my desktop computer (Windows 10 x64) - Chrome Version 86.0.4240.75 (Official Build) (64-bit) all is fine! The resources loads as expected!

How can I remedy this problem?

Kind regards /K

Kermit
  • 2,865
  • 3
  • 30
  • 53

1 Answers1

0

I found this post containing the solution to my problem: Webpack Code Splitting 'Loading chunk failed' error wrong file path

In conclusion:

That happens because output.publicPath by default is /. Just update [the webpack.config.js option] output.publicPath to point where you want it to be => /dist/.

Updating the output.publicPath in webpack.config.js solved my problem! Now the site and PWA works as expected!

A good practice seems to be to always include output.publicPath in your config to prevent possible problems. Kind regards /K

Kermit
  • 2,865
  • 3
  • 30
  • 53