Webpack: How can we *conditionally* use a plugin?

Question

In Webpack, I have the following plugins:

plugins: [
        new ExtractTextPlugin(\'styles.css\'),
        new webpack.optimize.UglifyJsPlugin({
            com         


        

Answer 1

I think the cleanest way is to set up multiple builds. If your webpack.config.js exports an array of config objects instead a single object, webpack will automatically do a build for each one. I have several different builds, so I define the shared the config as variables, loop over the factors that vary between builds, and within the loop use conditionals to check which build it is. For example:

let allConfigs = [];
let buildTypes = ['dev', 'optimized'];
buildTypes.forEach( (type) => {
  let buildConfig = {};
  // ... other config
  buildConfig.plugins = [];
  if (type === 'optimized') {
    // add Uglify to plugins array
  }
  // ...other config
  allConfigs.push(buildConfig);
});