CODEWITHSUNDEEP
javascriptcreate-react-appprogressive-web-apps
Frank Weslien
Frank Weslien

Reputation: 198

White screen on initial load when updating my progressive web app

I'm using create react app and recently added a service worker so as to make it a PWA. It was very easy and seemed to work great. However, now whenever I build a new version of my app I get the following error on the initial load of the website:

enter image description here

I believe the problem is that when I build my app the file names are randomly generated and don't match the old ones. The PWA is using the old index.html trying to fetch the old files which don't exist anymore.

What is the best way of fixing this?

Upvotes: 0

Views: 2689

Answers (1)

Frank Weslien
Frank Weslien

Reputation: 198

It turns out that the js file is too large to be precached. There are two approaches to solving the problem:

  1. split the bundle into smaller chunks (each <5mb)
  2. eject from create react app and increase the maximumFileSizeToCacheInBytes

You can read more in this StackOverflow answer: Create React App serviceworker is not including one of the generated files

Upvotes: 4

Related Questions