if-env NODE_ENV=production && npm run start:prod || npm run start:dev 

This command starts npm run start:prod without NODE_ENV.

Since it's a separate process you must to pass environment variables explicitly, like

if-env NODE_ENV=production && NODE_ENV=production npm run start:prod || npm run start:dev 

That's how I usually do that:

new webpack.DefinePlugin({  'process.env': {   NODE_ENV: JSON.stringify(process.env.NODE_ENV), }, }), 

And pass that to the array of the webpack plugins.

Why the problem happens: when wepack processes code - the code being processed is not actually run but simply read+processed. So when you run it - then it's too late to access environment variables.

You're checking the environment for the process running on server, while react runs in the browser so obviously it does not have access to the server process environment variables. Hence you need to inject it there explicitly during build time.