Make angular dependency annotation minification proof

The version 2.x uses babel 6.x plugin API, for babel 5.x versions use the babel-plugin-angular-annotate 1.x

npm install babel-plugin-angular-annotate

.babelrc

{ "plugins": [ ["angular-annotate", [configurations...]] ] }

$ babel --plugins angular-annotate script.js

require("babel-core").transform("code", { plugins: [ ["angular-annotate", [configurations...]] ] });

• Some injections wont work properly when using this plugin in conjuction with babel-preset-es2015. To get it working you need to use "passPerPreset": true in your .babelrc.

angular-annotate accepts a json like injection configuration starting with an array containing two items in this format: [method call, args].

method call is expressed as a string with the service name and method call. For instance "$injector.invoke". You can also nest calls. For instance: "$httpProvider.interceptors.push".

args is where you map each param with the corresponding injection strategy. The two possible are: "$injectFunction" and "$injectObject". Any other value will be ignored.

$injectFunction will transform:

function (a, b, c) { }

to

['a', 'b', 'c', function (a, b, c) { }]

For instance to create a rule for $injector.invoke you can apply the following configuration: ["$injector.invoke", ["$injectFunction"]].

So the following will be transformed:

Before:

$injector.invoke(function($state) { $state.go('somewhere'); });

After:

$injector.invoke(['$state', function($state) { $state.go('somewhere'); }]);

$injectObject will apply $injectFunction for each object value. This is mainly used in the resolve property from some services. For example:

The $routeProvider.when configuration can be expressed with the following:

["$routeProvider.when", ["_", { "controller": "$injectFunction", "resolve": "$injectObject" }]];

Before:

$routeProvider.when('/foo', { controller: function($scope) { $scope.message = 'foo'; }, templateUrl: 'foo.html', resolve: { store: function (foo) { } } });

After:

$routeProvider.when('/foo', { controller: ['$scope', function($scope) { $scope.message = 'foo'; }], templateUrl: 'foo.html', resolve: { store: ['foo', function (foo) { }] } });

Note that since we don't want to do anything in the routeName we use a "_" to ignore it.

Since configuring each service injection can be tedius, this libray includes some presets like: "angular", "ngMaterial", "ngRoute" and "ui.router". So you can simple include the following in .babelrc:

{ "plugins": [ ["angular-annotate", ["angular", "ngMaterial", "ui.router"]] ] }

Check the main file to see what injections are currently handled.

npm test

1. Fork it
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create new Pull Request