UglifyJsPlugin will change the class.name property

I’m using webpack with webpack.optimize.UglifyJsPlugin on an Angular app, I’d like to use this syntax to define controller:

// in header.controller.js
class HeaderController {...}
export default HeaderController;
// in app.js
import HeaderController from './header.controller'
angular.module('app', [])
    .controller(HeaderController.name, HeaderController);

However, I found uglify will change the class name, how to disable this?

Author: Fantashit

6 thoughts on “UglifyJsPlugin will change the class.name property

  1. @sokra That’s not the case, ng-annotate can only handle the missing dependencies, but this issue is related to function name has been mangled. I tried to use the config below:

    new webpack.optimize.UglifyJsPlugin({
        compress: {
             warnings: false,
             keep_fnames: true
        },
        mangle: {
             keep_fnames: true
        }
    })
    

    But it can not solve this issue.

  2. Finally I found the root cause, if you use -p, the UglifyJSPlugin will mangle variables by default, even if you have another new webpack.optimize.UglifyJsPlugin in your config, so if you want to config the UglifyJSPlugin, do not use -p.

    I also file a bug on Webpack’s doc webpack/docs#49, the default mangle option for UglifyJsPlugin is not false, so if you do not want to mangle variables, you need to explicitly set this to false: new webpack.optimize.UglifyJsPlugin({mangle: false}).

  3. This issue is not AngularJS specific. I’m using webpack@1.13.0 for a React application and the mangling of class names as a default config option in for -p builds is affecting me. I don’t understand why this issue is closed with a link to a doubtful workaround applicable only to AngularJS apps.

  4. 666,it works!!! thks guys

     "webpack": "^1.12.9"
    
    /**
         * compress js
         */
        new webpack.optimize.UglifyJsPlugin({
            compress: {
                 warnings: false
            },
            mangle: {
                except: ['$super', '$', 'exports', 'require', 'angular'],
                keep_fnames: true//it works
            }
        }),

Comments are closed.