Using Grunt uglify task to mangle JS code

Question

I'm attempting to use the Grunt uglify task to mangle my javascript code, and while I can make minify work, I can't figure out how to pass the 'mangle' option. My Gruntfile contains:

uglify: {
  dist: {
    mangle: true,
    files: {
      '<%= yeoman.dist %>/scripts/scripts.js': [
        '<%= yeoman.dist %>/scripts/scripts.js'
      ]
    }
  }
},

...

  grunt.registerTask('build', [
    'clean:dist',
    'wiredep',
    'useminPrepare',
    'concurrent:dist',
    'autoprefixer',
    'concat',
    'ngAnnotate',
    'uglify',
    'copy:dist',
    'cdnify',
    'cssmin',
    'filerev',
    'usemin',
  ]);

With this setup, when I run "grunt build" the uglify task reports success, and my javascript is minified, but not mangled. Can anyone tell me what I'm doing wrong?

possible duplicate of [Uglify-js doesn't mangle variable names](http://stackoverflow.com/questions/10959154/uglify-js-doesnt-mangle-variable-names) — vitr, Jul 03 '15 at 09:50
Try: -mt or --mangle-toplevel see above or https://github.com/mishoo/UglifyJS2#mangler-options — vitr, Jul 03 '15 at 09:50
Hi Vitr, I've read up on the options, the problem I'm having is how to pass these within Grunt. Does this go into the Gruntfile? Do I use it as a flag on "grunt build"? — hugh, Jul 03 '15 at 11:56

score 2 · Accepted Answer · answered Jul 03 '15 at 13:08

You need to put mangles in an options object, either at task or target level, for example:

uglify: {
  dist: {
    options: {
        mangle: true,
    },
    files: {
      '<%= yeoman.dist %>/scripts/scripts.js': [
        '<%= yeoman.dist %>/scripts/scripts.js'
      ]
    }
  }
},

Using Grunt uglify task to mangle JS code

1 Answers1