workbox
workbox copied to clipboard
precacheAndRoute may cause an infinite loop on Webpack's HMR
Library Affected: workbox-precaching
Browser & Platform: All browsers
Description:
I'm creating a PWA application from scratch with React and Webpack, no third-party frameworks like Next.JS.
As recommended, added precacheAndRoute(self.__WB_MANIFEST);
into my service worker script.
Problem:
If Hot Module Reload
is configured on Webpack
, self.__WB_MANIFEST
includes some of the .hot-update.json
files, used by Webpack to detect if something has changed.
The first time, you won't notice anything bad but, if you restart webpack and refresh the page, the precached code will try to look for an outdated hot update file. Because 404 is returned, webpack dev server executes a full page reload causing this event to be repeated for ever.
Workaround:
Removing the call to precacheAndRoute
fixes the issue.
Expected solution:
I believe removing hot update JSON entries from __WB_MANIFEST
is the correct solution.