question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

ServiceWorker not built in 4.x (next)

See original GitHub issue

Describe the bug

./build/service-worker.js is no longer generated at all (and there are no error messages) with the latest versions of CRA (4.x) using @next.

Did you try recovering your dependencies?

Yes.

Which terms did you search for in User Guide?

N/A

Environment

(paste the output of the command here.)

Steps to reproduce

(Write your steps here:)

  1. npx create-react-app test
  2. cd test
  3. npm install --save react-scripts@next
  4. npm run build
  5. ls -la ./build

Expected behavior

./build/service-worker.js should be present.

Actual behavior

The file is missing. This causes a problem with apps which are upgrading from prior CRA versions, as they continue to reference the cached service worker (so the web app continues to cache old assets).

Reproducible demo

Just run the commands above.

Issue Analytics

  • State:open
  • Created 3 years ago
  • Reactions:22
  • Comments:21 (1 by maintainers)

github_iconTop GitHub Comments

39reactions
zaneclaescommented, Nov 17, 2020

It would be nice if there were a decent upgrade path, here. Or just a documented one.

For those upgrading to 4.x in an existing project, this is an extremely confusing change. In my case, it transparently broke my application due to a sudden lack of service workers. As others have noted, the upgrade docs are woefully insufficient.

In any case, my “fix” was to create a dummy app:

npx create-react-app my-app --template cra-template-pwa-typescript

And copy over the relevant code:

  • reportWebVitals.ts
  • service-worker.ts
  • serviceWorkerRegistration.ts

As well as the initialization code in index.tsx.

8reactions
kiverviniciuscommented, Nov 4, 2020

I believe that there are more complaints about forcing a service worker by default than not, but it is extremely simple to continue using serviceWorker.

npx create-react-app my-app --template cra-template-pwa

Read more comments on GitHub >

github_iconTop Results From Across the Web

404 error when trying to register serviceWorker - Stack Overflow
I get this error when trying to register the service worker: Failed to register a ServiceWorker: A bad HTTP response code (404) was...
Read more >
Using Service Workers - Web APIs | MDN
This article provides information on getting started with service workers, including basic architecture, registering a service worker, ...
Read more >
Service worker isn't working? Here's a small detail you might ...
So if you've decide to not build the service worker from scratch and instead use the one in the src folder, this may...
Read more >
Service workers - web.dev
This doesn't mean, though, that the page that registered the service worker will be managed. By default, the service worker will not take...
Read more >
4. Service Worker Lifecycle and Cache Management - O'Reilly
By deleting the service workers, you make sure that on your next visit, you will see the page as a new user who...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found