Empty REACT_APP_ env vars in .env.production cannot override its counterpart in .env

Created by: MrOrz

Is this a bug report?

Yes.

When an REACT_APP_ environment variable is set in .env, we cannot overwrite it with an empty string.

In our scenario, our app tries to connect to an development API server running on local machine, but in production the static files built with npm build will be served directly with API server. The host name is set through an REACT_APP_ENDPOINT environment variable, with it being localhost in .env and being an empty string in .env.production. However, the empty string somehow cannot override the settings in .env.

In reality I worked-around this by putting REACT_APP_ENDPOINT in .env.development. Also, for API servers we can also use proxies instead. However, I think it's still a bit counter-intuitive that settings in .env.production cannot override the one in .env. That's why I opened this issue.

Did you try recovering your dependencies?

It's reproducible in fresh install of create-react-app

Which terms did you search for in User Guide?

env then read through "Adding Custom Environment Variables"

Environment

node -v: v8.9.0
npm -v: 5.5.1
npm ls react-scripts (if you haven’t ejected): react-scripts@1.1.0

Then, specify:

Operating system: Mac OSX

Steps to Reproduce

Create .env and write REACT_APP_ENDPOINT=http://localhost:8080
Create .env.production and write REACT_APP_ENDPOINT=
inApp.js put:

console.log('ENDPOINT', REACT_APP_ENDPOINT} + '/api');

npm run build
Manually open the built main..js, search for 'ENDPOINT: '

Expected Behavior

Find this in the built js:

console.log('ENDPOINT', '/api');

Actual Behavior