Mini-css-extract-plugin: Add the "disabled" option

[dstarosta]

ExtractTextPlugin has a disabled option that can be used to easily disable it during hot reload or watch builds. It would be a nice enhancement to the MiniCssExtractPlugin as well.

[michael-ciniawsky]

webpack.config.js

const env = process.env.NODE_ENV  || 'development'

const config = {
   mode: env, 
   ...
   plugins: [
     this.mode === 'production' ? new MiniCSSPlugin() : false 
   ].filter(Boolean)
}

That's the 'generic' way to do it within webpack.config.js applicable to all kind of env || mode related settings, no need to add an extra option here...

[dstarosta]

The problem is you would have to add the same conditional logic to the loader which gets messy especially if you support multiple CSS formats (CSS, LESS...).

Otherwise, webpack throws the following error:

Module build failed: TypeError: this[NS] is not a function

[michael-ciniawsky]

It seems that MiniCSSExtractPlugin doesn't support the fallback anymore, so a disable option wouldn't add any benefit here since you need to handle the loader part manually anyways...

webpack.config.js

const css = (env = 'development', extend = []) => [
   env === 'production' ? MiniCSS.loader : 'style-loader',
   'css-loader',
].concat(extend)

const config = {
   module: {
      ...
         use: css(this.mode, [ 'some-loader' ])
      ...
   }
}