Expose mangle option for UglifyJsPlugin

[Kezino]

Greetings!

Came across the problem of AgularJs minification. Some third party modules are not minified correctly with mangle option enabled. It throws error like Error: Unknown provider: tProvider <- t. Unfortunately, there is no way to disable mangle via Encore interface. Please, add the option. Thank you in advance!

P.S. For those, experiencing the same problem, here's how I solved it:

...

let config = Encore.getWebpackConfig(),
    webpack = require('webpack');

if (Encore.isProduction()) {
    let index;

    config.plugins.forEach((plugin, i) => {
        if (plugin instanceof webpack.optimize.UglifyJsPlugin) {
            index = i;
        }
    });

    if (index) {
        config.plugins.splice(index, 1);
    }

    config.plugins.push(new webpack.optimize.UglifyJsPlugin({
        mangle: false,
        sourceMap: !Encore.isProduction()
    }));
}

[Lyrkan]

Hi @Kezino,

There is indeed some work that still needs to be done related to plugins configuration. In this case we'd probably need an Encore.configureUglifyJsPlugin(callback) method, I'll see what I can do for that one.

Your workaround can also be a little bit simplified since you only want to modify a single option of that plugin (no need to remove and add the plugin and its other options again):

if (Encore.isProduction()) {
    for (const plugin of config.plugins) {
        if (plugin instanceof webpack.optimize.UglifyJsPlugin) {
            plugin.options.mangle = false;
        }
    }
}

[stof]

Disabling mangling will impact the size of the production build a lot. This is a bad idea.

what you should do instead is making your Angular code mangling-safe (i.e. not relying on parameter names for guessing the dependency at runtime). There is https://github.com/schmod/babel-plugin-angularjs-annotate which is the recommended way to do this guessing during the Babel compilation instead, turning the code into a explicitly-configured injection rather than a guessed one (while still writing it using guessing).
This is a must-have for an Angular project if you rely on argument names to configure the injection.