webpack: TypeError: webpack.optimize.UglifyJsPlugin is not a constructor

Any docs available for config.optimization.minimize? Google brings up zero results.

Also it’d be nice to include a friendly message about this in webpack itself because plenty of people will be hitting that error.

I was using an outdated structure, the config needs to be wrapped with uglifyOptions:

optimization: {
  minimizer: [
    new UglifyJSPlugin({
      uglifyOptions: {
        mangle: {
          keep_fnames: true,
        },
      },
    }),
  ],
},

Sorry for spamming.

@bfred-it - https://gist.github.com/sokra/1522d586b8e5c0f5072d7565c2bee693

optimization: {
    minimize: true,
    runtimeChunk: true,
    splitChunks: {
        chunks: "async",
        minSize: 1000,
        minChunks: 2,
        maxAsyncRequests: 5,
        maxInitialRequests: 3,
        name: true,
        cacheGroups: {
            default: {
                minChunks: 1,
                priority: -20,
                reuseExistingChunk: true,
            },
            vendors: {
                test: /[\\/]node_modules[\\/]/,
                priority: -10
            }
        }
    }
}

I could be mistaken, but if you look at https://github.com/webpack/webpack/blob/next/lib/WebpackOptionsApply.js#L306, you’ll see that if optimization.minimize = true, then webpack just takes the array of plugins from optimization.minimizer (e.g. optimization.minimizer = [new UglifyJSPlugin(your options)]) and applies it to the compiler. So I think that’s how you should configure the uglify plugin.

Now it’s even more confusing. What exactly minimize option is doing then?

My bad. I copied that part from an example from somewhere. Also, when i searched for it VScode didn’t distinct the uppercase from the lowercase, but instead recognises the words as its whole.

Thank you 😃

But sure, minimize could also accept an object and pass it to minimizer. What do you think about this @sokra?

And first of all, you need to install the package npm install uglifyjs-webpack-plugin --save-dev

@D19cannon seriously? You use const UglifyJsPlugin = require('uglifyjs-webpack-plugin') in top, but in minimizer option you use UglifyJSPlugin. Look on s in plugin name (first example with lowercase, second in UPPERCASE)

webpack.optimize.UglifyJsPlugin is gone in webpack 4.

Now you must load the plugin:

const UglifyJsPlugin = require("uglifyjs-webpack-plugin");

And register it:

optimization.minimizer = [new UglifyJSPlugin(…)]

@backflip ?

optimization: {
  minimizer: {
    mangle: {
      keep_fnames: true,
    },
  },
},

If you set minimize: false you won’t have double minification.

What I don’t understand is why not make minimize accept a uglifyjs-webpack-plugin config object.