1

Using Webpack 4, how can I run optimize-js after Webpack runs Uglify?

It seems that in earlier versions of Webpack, you would use a plugin like optimize-js-plugin. I couldn't get this to work as Webpack appears to apply plugins before minifying code, so the optimize-js transformation is lost when Uglify minifies.

I tried setting optimization.minimizer to [] in my Webpack config, which disabled the built-in minification, but when I added UglifyjsWebpackPlugin to my plugins, it didn't seem to do anything and I got unminified sources.

Thoughts?

My additional requirement is that I need to preserve source maps through all the transformations so I can map from the post-Optimize, post-Uglify sources back to the original TypeScript sources (so I can get resolve crash stacks into something meaningful).

My next route would be to just write a script that calls optimize-js via the Node APIs and then use source-map-merger (or similar) to preserve the source maps. The downside would be that a script like this would run outside of Webpack and I somehow have to identify all the webpack outputs. Fairly straightforward, but not ideal.

1 Answers1

2

Have you tried defining both plugins as minimizers, in the order you want them to be applied:

optimization.minimizer: [
    new UglifyJsPlugin({...}),
    new OptimizeJsPlugin({...})
]
sdgluck
  • 24,894
  • 8
  • 75
  • 90