简介
ng-annotate-loader 是一个用于自动化添加 AngularJS 依赖注入标记的 webpack loader。通过使用这个 webpack loader，我们可以不用显式地依赖注入，而是让 webpack 自动地将依赖注入标记添加到源代码中。
安装
ng-annotate-loader 依赖于 ng-annotate 模块，所以要先安装 ng-annotate：
npm install ng-annotate --save-dev
然后安装 ng-annotate-loader：
npm install ng-annotate-loader --save-dev
使用
在 webpack 的配置文件中添加一个新的 loader：
-- -------------------- ---- -------
-------------- - -
-- ---
------- -
------ -
-
----- --------
------- ---------------------
-------- --------------
-
-
-
-这个 loader 通常与其他的一些 loader 一起使用，例如 babel-loader、eslint-loader 等：
-- -------------------- ---- -------
-------------- - -
-- ---
------- -
------ -
-
----- --------
---- -
-
------- --------------
--
-
------- ---------------------
-------- -
----------- ---------------------
-
--
-
------- ---------------
-
-
-
-
-
-在这个例子中，我们使用 babel-loader 将 ES6 代码编译成 ES5 代码，并且使用 ng-annotate-loader 自动注入依赖。
示例
下面是一个简单的示例，对一个 AngularJS 控制器进行依赖注入：
angular.module('app')
.controller('MyController', function ($scope, $http) {
// ...
});使用 ng-annotate-loader 后，这段代码将自动转换成：
angular.module('app')
.controller('MyController', ['$scope', '$http', function ($scope, $http) {
// ...
}]);结论
通过使用 ng-annotate-loader，我们可以在不显式地编写依赖注入标记的情况下，自动注入 AngularJS 依赖。这使得我们可以更加专注于代码的逻辑部分，而不用担心手动编写复杂的依赖注入语句。
因此，在使用 AngularJS 开发时，推荐使用这个工具来简化代码的编写过程。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65578