Error: Using babel-preset-react-app requires that you specify NODE_ENV or BABEL_ENV

[nicklayb]

Can you reproduce the problem with latest npm?

yes

Can you still reproduce it?

yes

Description

When creating a new react app with create-react-app without doing anything, only running yarn start gives the following error :

Failed to compile.
./src/index.js
Module build failed: Error: Using `babel-preset-react-app` requires that you specify `NODE_ENV` or `BABEL_ENV` environment variables. Valid values are "development", "test", and "production". Instead, received: "undefined".
 (While processing preset: "/Users/nboisvert/Git/memberzone/node_modules/babel-preset-react-app/index.js")
    at Array.map (native)

Expected behavior

Run the template React app

Actual behavior

Displays :

Environment

Run these commands in the project folder and fill in their results:

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

memberzone@0.1.0 /Users/nboisvert/Git/memberzone
└── react-scripts@1.0.6

2. node -v:
   v6.2.1
3. npm -v:
   4.6.1

Then, specify:

1. Operating system:
   macOS Sierrra 10.12.5
2. Browser and version:
   Google Chrome Version 58.0.3029.110 (64-bit)

Reproducible Demo

Didn't add anything. Fresh install

[nicklayb]

Manage to resolve it by adding it to the .zshrc file, I've never had this before. I added the following :

export NODE_ENV=development
export BABEL_ENV=$NODE_ENV

And it works as expected, hope it could helps others!

Note from maintainers: this is not a good fix because it will build your production projects in development mode. Don’t do it! Instead subscribe to this issue and provide more details about your system if you experience this.

[gaearon]

Hmm this doesn't sound right at all. You shouldn't need to set anything, and in fact setting them like this can create later issues.

[gaearon]

We are forcefully setting NODE_ENV to development from node_modules/react-scripts/scripts/start.js. I've never seen it getting reset after this.

[gaearon]

Can you try deleting node_modules, running npm install and then trying again?
How do you run the app?

[cwissy]

same problem as @nicklayb - the .zshrc solution worked for me too 😄 . Deleting node_modules and re-npm-installing had no effect. Running the app through npm start

[AndrewBastin]

I am also facing the same issue... It's in Windows though...
@nicklayb's solution worked for me as well on git bash....

[gaearon]

I'm worried that if you just add this to your rc files you'll get development builds from production too. This is not the right solution and will give you builds many times bigger than they should be.

Can you investigate why a variable set in that script "disappears" by the time that Babel preset executes? We really need more information here because I can't reproduce it. The suggested solution in this thread is dangerous and you should not do it but instead I encourage you to try to diagnose the issue.

[gaearon]

Everybody who has this problem, please could you share:

• your node version
• your shell
• your OS
• whether this reproduces in a different shell (eg if you are a zsh user try bash)
• whether this reproduces both for npm start and npm run build

[AndrewBastin]

I understand... I am currently using this as only a temporary hack...

Node Version : v7.9.0
Shell: Powershell (and Git Bash)
OS : Windows 10 (Anniversary Update)
The issue has so far popped up in Git Bash and Powershell (presumably cmd as well)..
Though on Git Bash I used the solution above as a workaround to get through...
npm start was affected... npm run build failed to run once for me but ran the second time... The generated production build was fine and did not show any errors as well (All done in Powershell)

[gaearon]

Can you please remove the hack, verify it still fails on npm start, and then add this line to node_modules/react-scripts/scripts/start.js:

// ...
process.on('unhandledRejection', err => {
  throw err;
});

process.env.NODE_ENV = 'development';
+process.env.BABEL_ENV = 'development';

at about line 20, and try npm start again?

[AndrewBastin]

Yay... That fixed it 😄

[gaearon]

Can you post the exact message you were seeing before the fix? Did it also say "Instead received: undefined" or something else?

[AndrewBastin]

/src/index.js
Module build failed: Error: Using babel-preset-react-app requires that you specify NODE_ENV or BABEL_ENV environment variables. Valid values are "development", "test", and "production". Instead, received: "undefined". (While processing preset: "C:\Users\Andrew Bastin\Desktop\test\node_modules\babel-preset-react-app\index.js")
at Array.map (native)

[gaearon]

That's great, thanks.

[gaearon]

Please try react-scripts@1.0.7 (or create a new project).
Should hopefully fix the issue.

https://github.com/facebookincubator/create-react-app/releases/tag/v1.0.7

[Ethan-liao]

Adding "+process.env.BABEL_ENV = 'development';" worked for me too :)

[heshamelmasry77]

to fix this you need to do that :
create a .babelrc file and then add this following code in it.

{
  "presets": [
    "react",
    "es2015",
    "stage-2"
  ]
}

i am using es2015 and stage-2 and for your : scripts : start.js add this :

process.env.BABEL_ENV = 'development';
process.env.NODE_ENV = 'development';

you can create a development , test, build one. my advice to you and i found that it is good to understand what is happening is to eject the react project.

[English3000]

What's the fix for a non-CRA app that uses babel-preset-react-app?

Already tried adding to plugins: [ new webpack.EnvironmentPlugin({ NODE_ENV: 'development' }) to no avail.

Update: My workaround was to simply switch to babel-preset-react config.