Get mode in webpack config [webpack 4]

Question

How can I get mode in the webpack config, for instance,for pushing some plugins.

package.json

"scripts": {
  "dev": "webpack --mode development",
  "build": "webpack --mode production"
}

What I did in webpack 3

package.json

"scripts": {
    "build": "cross-env NODE_ENV=development webpack",
    "prod": "cross-env NODE_ENV=production webpack"
  },

Then, I was able to get environment in the webpack by process.env.NODE_ENV

Of course, I can pass NODE_ENV with --mode but I prefer to avoid duplication.

Answer 1

You want to avoid duplication of options passed on the script.

When you export a function, the function will be invoked with 2 arguments: an environment as the first parameter and an options map as the second parameter.

package.json

"scripts": {
  "build-dev": "webpack --mode development",
  "build-prod": "webpack --mode production"
},

webpack.config.js

module.exports = (env, options) => {
    console.log(`This is the Webpack 4 'mode': ${options.mode}`);
    return {
        ...
    };
}

These are the results:

For npm run build-dev:

> webpack --mode development

This is the Webpack 4 'mode': development
Hash: 554dd20dff08600ad09b
Version: webpack 4.1.1
Time: 42ms
Built at: 2018-3-14 11:27:35

For npm run build-prod:

> webpack --mode production

This is the Webpack 4 'mode': production
Hash: 8cc6c4e6b736eaa4183e
Version: webpack 4.1.1
Time: 42ms
Built at: 2018-3-14 11:28:32