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.

Question: How can I prevent mockServiceWorker.js from being added to build folder?

See original GitHub issue

Hi.

I have initialised the mock service worker for browser integration in my React app and is in the public folder. The file states that it shouldn’t be deployed to production.

How can I prevent the file from being added to the build when I run npm run build.

Would the service worker start in the browser even though in the index file I only start the worker if the NODE_ENV is not production?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:4
  • Comments:5 (2 by maintainers)

github_iconTop GitHub Comments

7reactions
kettanaitocommented, Jul 27, 2020

I don’t think there is more to suggest in this matter, so I’m closing the issue. Please, feel free to discuss here further, I will reopen it in case we come to the conclusion this can be somehow handled as a part of the library’s API, but I doubt that. Thanks!

5reactions
kettanaitocommented, Jul 25, 2020

Hey, @PritamSangani.

Although you copy the mockServiceWorker.js file into your public directory, the Service Worker will not get registered automatically. For that you need to explicitly call worker.start() as a part of your application’s code.

Would the service worker start in the browser even though in the index file I only start the worker if the NODE_ENV is not production?

No, it wouldn’t. The only thing you’d have is a JavaScript file (worker script) that is not used by anything in production.

The worker script is required to be in a public directory in order to be served by your application during development. We’ve chosen a file copying strategy to give you a transparent control over the script itself, and to better understand where the Service Worker actually is. However, since the worker script is in the public directory, it most likely gets copied to the built version of the application as well. While this has no negative effect on its own (considered you’ve enabled mocking conditionally in your application’s code), it still introduces an unused build file, which may get confusing.

I’m not sure what recommendation to give here. If the unused file annoys you, consider having a cleanup script that runs on CI, so you don’t lose the worker script locally each time you build. If you don’t mind the file itself, just make sure you are not enabling the mocking on production and you should be fine.

Let me know which solution you choose, I’m curious.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How copy down mockServiceWorker.js file in React ...
js file to my build folder (using Webpack), like the other assets images and fonts and so on? I used the command npx...
Read more >
Getting started with Mock Service Worker - LogRocket Blog
In this tutorial, we'll learn about Mock Service Worker and how we can use it to mock network requests. We'll build a chat...
Read more >
Browser - Getting Started - Mock Service Worker Docs
In the browser.js file we are going to create a worker instance with our request handlers defined earlier. Import setupWorker function from ...
Read more >
How You Can Serve React Build Folder From an Express ...
In this article, we will create a simple React app, run npm, run build, and serve the build folder from Express. The first...
Read more >
Using Mock Service Worker to Improve Jest Unit Tests - WWT
For our Create React App based project this is put into the /public folder. For the Node test environment, we created a mswServer...
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 Reddit Thread

No results found

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