create-react-app: REACT_APP_X env variable does not show up on front-end as process.env.REACT_APP_X

I have this start script in package.json

"start-dev": "REACT_APP_SECRET_CODE=development && react-scripts start",

on the front-end, I execute this

console.log(' => Process env => ',process.env);

It appears that process.env on the front-end is an empty object, but according to the docs I should expect this:

{
REACT_APP_SECRET_CODE:'development'
}

what am I doing wrong?

About this issue

Original URL
State: closed
Created 8 years ago
Comments: 15 (6 by maintainers)

Most upvoted comments

I created a new project and put

console.log(process.env);

in it.

I am seeing an object being printed:

Next, let’s try a custom variable. The way you specify environment variables is incorrect.

The User Guide section I referred you to earlier also shows how to do it:

Linux, OS X (Bash)
REACT_APP_SECRET_CODE=abcdef npm start

Note it’s REACT_APP_SECRET_CODE=abcdef npm start and not REACT_APP_SECRET_CODE=abcdef && npm start. There is no && there.

If I remove && from your example then the logged object looks like this:

As you can see the environment variable is now available. However if all you want is to tell if the app is running in production, process.env.NODE_ENV is enough. You don’t need to pass anything else.

I hope this helps!

gaearon on Dec 13, 2016

Np, I can figure it out, it may be that the project I am working on was modified so that the env variables no longer get sent to the front-end via the HTML. thanks for your help, at least I know absolutely what the expected behavior is. I will start from a new app and figure it out

ORESoftware on Dec 13, 2016