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.

Custom environment variables: unset variables cause unexpected minification

See original GitHub issue

Can you reproduce the problem with latest npm?

yes (with latest yarn)


If a custom environment variable is not set minification will not strip out dead code related to it.

This could cause unwanted development assets to go into the production build if the environment variables are not properly set.

If this is works as planned perhaps I could try to create a PR to mention this in the documentation.

Please consider the following example when running yarn run build:

if (process.env.REACT_APP_FOO === 'bar') {
  console.log('REACT_APP_FOO: bar')
} else {
  console.log('REACT_APP_FOO: something else');

Expected behavior

string REACT_APP_FOO: bar is not included in the bundle.

Actual behavior

REACT_APP_FOO: bar is included in the bundle.


  1. npm ls react-scripts (if you haven’t ejected): └── react-scripts@0.9.4

  2. node -v: v6.10.0

  3. npm -v: 3.10.10

  4. Operating system: macOS

  5. Browser and version: Chrome 56.0.2924.87 (64-bit)

Reproducible Demo

Repo: Steps:

cd my-app
yarn run build
cat build/static/js/main.*.js | grep -Eo "REACT_APP_FOO: bar"
# returns REACT_APP_FOO: bar
REACT_APP_FOO="foobar" yarn run build
# does not return anything

Issue Analytics

  • State:closed
  • Created 7 years ago
  • Comments:7 (4 by maintainers)

github_iconTop GitHub Comments

gaearoncommented, Apr 19, 2017

I think this is the expected behavior.

For differentiating between production and development builds, I recommend checking process.env.NODE_ENV which is hardcoded and will always be specified.

For custom environment variables, you can employ a trick like:

if (process.env.REACT_APP_FOO === 'bar') {
  console.log('REACT_APP_FOO: bar')
} else if (process.env.REACT_APP_FOO === 'baz') {
  console.log('REACT_APP_FOO: baz');
} else {
  throw new Error('You forgot to specify REACT_APP_FOO in the build.');

Then at least you’d get a completely crashing bundle and presumably would find the mistake soon enough.

But technically accessing process.env.WHATEVER should be safe so IMO we shouldn’t introduce non-obvious semantics there (like suddenly failing if it is missing).

WickyNilliamscommented, Dec 8, 2017

I’ve just noticed this same issue. If you reference an unset env var like this:


Then the output of the build from CRA is:


I have tested with just webpack (i.e. no CRA), and it outputs (as expected) this:


When encountering an unknown env var, webpack will leave the code verbatim, but define process.env = {} somewhere else, so the code evaluates to undefined.

I’m not sure what is causing this in CRA, but it should be fixed. It’s wasteful to output the whole process.env object just to get something that evaluates to undefined, you lose some dead code elimination as originally stated here, and it is also leaking some information in the bundle (though env var names are arguably insignificant, they could unwittingly reveal something you would not want exposed).

@gaearon should i create a new issue for this? It’s the underlying cause of what was originally reported here

Read more comments on GitHub >

github_iconTop Results From Across the Web

Solved: Environment Variable Returning Unexpected Value
I have a flow in a solution being used to return the value of an environment variable, that is used to determine which...
Read more >
Configuring Vite
Environmental Variables can be obtained from process.env as usual. ... which will expose all your env variables and cause unexpected leaking of of...
Read more >
Corrected Cypress environment variable resolution to correctly resolve environment variables set with npm config set . Fixes #24556.
Read more >
Inherit environment variables from dependent jobs - GitLab
CI/CD often needs to pass information from one job to another and artifacts can be used for this, although it's a heavy solution...
Read more >
Equivalent to setting `ie8: true` in `minify()` for `compress`, `mangle` and `format` options. By default Terser will not try to be IE-proof. -- ......
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 Post

No results found

github_iconTop Related Hashnode Post

No results found