Passing the NODE_ENV value using Webpack via DefinePlugin

Question

I am trying to inject the NODE_ENV value into my code using webpack via DefinePlugin. I checked, more or less, an identical question,

Answer 1

The DefinePlugin expects strings so you need to JSON.stringify() any values passed into it.

new webpack.DefinePlugin({
    PRODUCTION: JSON.stringify(PRODUCTION),
    DEVELOPMENT: JSON.stringify(DEVELOPMENT)
})

Answer 2

The problem is because you are using cross-env in a wrong way. It only changes env variables for its context, so when you use '&&' to run webpack it is already gone and webpack see nothing.

So you MUST write

"scripts": {
    "build": "rimraf dist && cross-env NODE_ENV=production webpack",
    "dev": "cross-env NODE_ENV=development node webpack-dev-server.js"
},

note that you have wrote right for "build" script.

Another question is about that If you want do references to "process.env.PRODUCTION" inside your code base you should write:

   new webpack.DefinePlugin({
        "process.env.PRODUCTION": JSON.stringify(PRODUCTION),
        "proccess.env.DEVELOPMENT": JSON.stringify(DEVELOPMENT),
    });