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.

[React]: Build prod generates 2 builds even with latest browser in browserlist still

See original GitHub issue

Current Behavior

yarn build app --prod always generates 2 prod builds (esm and es5) even when the newest browsers are specified in browserslist.

Expected Behavior

Add a possibility for the developer to decide about the build version and be able to force only one build. You may ask why? For example to allow service workers usage generated by workbox (see https://developers.google.com/web/tools/workbox/modules/workbox-webpack-plugin). The current configuration doesn’t allow me to use the webpack plugin because of two builds (one build overrides the other one when injecting manifest to service worker).

Steps to Reproduce

See reproduction in this PR https://github.com/darkowic/nx-examples/pull/1 Here is browserslist file https://github.com/darkowic/nx-examples/pull/1/files#diff-7dd1c466112a2275694f8d6b13dcc997

Steps:

Install dependencies
Build example yarn build react-example --prod
See 2 production builds
npx http-server dist/apps/react-example/ and open page then go to offline - service worker doesn’t work at all

Note: it works in dev mode and dev build… it is even more confusing to debug it because of it 😛

To work around the issue, I use patch-package library and comment out the second build from web builder - https://github.com/darkowic/nx-examples/pull/1/files#diff-ff5cf6c862873d747cfdf24ade8bcb71

Failure Logs

Environment

$ nx report

>  NX  Report complete - copy this into the issue template

  @nrwl/angular : 9.5.0-rc.0
  @nrwl/cli : 9.5.0-rc.0
  @nrwl/cypress : 9.5.0-rc.0
  @nrwl/eslint-plugin-nx : Not Found
  @nrwl/express : Not Found
  @nrwl/jest : 9.5.0-rc.0
  @nrwl/linter : 9.5.0-rc.0
  @nrwl/nest : Not Found
  @nrwl/next : Not Found
  @nrwl/node : Not Found
  @nrwl/react : 9.5.0-rc.0
  @nrwl/schematics : Not Found
  @nrwl/tao : 9.5.0-rc.0
  @nrwl/web : 9.5.0-rc.0
  @nrwl/workspace : 9.5.0-rc.0
  typescript : 3.8.3

Issue Analytics

State:
Created 3 years ago
Reactions:2
Comments:6 (1 by maintainers)

Top GitHub Comments

1reaction

brianmcdcommented, Jul 21, 2020

I think this should be fixed by https://github.com/nrwl/nx/pull/3319 in Nx 10.

0reactions

darkowiccommented, Jul 23, 2020

Thanks for fixing it! @FrozenPandaz how about providing an option to force the behavior? It is useful for applications with service workers

Top Results From Across the Web

Blank page after running build on create-react-app

I'm using .env file for loading firebase api key is that a problem for build? Even when I tried to open it locally...

Hello, Create React App 2.0! - Telerik

In this blog post, Eric Bishard will walk you through what's changed in Create React App and how you can use it in...

Using Create-React-App with Express - DEV Community ‍ ‍

Step 1: Install create-react-app · Step 2: Install packages for create react app · Step 3: Install express · Step 4: Create a...

To v5 from v4 - webpack

Upgrade webpack 4 and its plugins/loaders · Make sure your build has no errors or warnings · Make sure to use mode ·...

Targets - Parcel

This happens automatically based on your browser targets, as declared in the "browserslist" field in your package.json. If no browserslist is declared, or...