AngularJS Creating Minification-Safe Angular Controllers


Example

To create minification-safe angular controllers, you will change the controller function parameters.

The second argument in the module.controller function should be passed an array, where the last parameter is the controller function, and every parameter before that is the name of each injected value.

This is different from the normal paradigm; that takes the controller function with the injected arguments.

Given:

var app = angular.module('myApp');

The controller should look like this:

app.controller('ctrlInject', 
    [
        /* Injected Parameters */
        '$Injectable1', 
        '$Injectable2', 
        /* Controller Function */
        function($injectable1Instance, $injectable2Instance) {
            /* Controller Content */
        }
    ]
);

Note: The names of injected parameters are not required to match, but they will be bound in order.

This will minify to something similar to this:

var a=angular.module('myApp');a.controller('ctrlInject',['$Injectable1','$Injectable2',function(b,c){/* Controller Content */}]);

The minification process will replace every instance of app with a, every instance of $Injectable1Instance with b, and every instance of $Injectable2Instance with c.