Question

我对利用编译器工具自动化/简化角度项目感兴趣，这可能适用于其他所有事情，但角度注入和命名空间很难以逃避编译器知识。这样做的最佳/专业方法是什么？

谢谢，最后一件事，

app.controller('ctrl',['$rootScope',function($rootScope){
    ...
}]);

在缩小时起作用，但我如何缩小

app.config(['$routeProvider', function($routeProvider){

}]);

当我缩小连续的动作时它会起作用吗？

app.controller(...).directive(...).run(...)

Answer 1

在Angular中，您需要为注入器注释函数，以了解要在函数中注入的依赖项。在官方角度网站上描述的函数中基本上有三种方法可以注入依赖项。这三种方式是：

1.使用内联数组注释

 yourModule.controller('yourController', ['$scope', function($scope) {}]);

2.使用$ inject属性注释

var yourController = function($scope) {};

yourController.$inject = ['$scope'];

yourModule.controller('yourController', yourController);

3.Iplictly来自函数参数名称

yourModule.controller('yourController', function($scope) {});

现在，当您缩小项目时，您的依赖项名称将被重命名。在第一种情况下，您的代码就像

yourModule.controller('yourController', ['$scope', function(e) {}]);

在第三种情况下，您的代码就像

yourModule.controller('yourController',  function(e) {});

它会破坏您的应用，因为angular无法识别您的依赖项名称。因此建议永远不要在项目中使用隐式依赖注入。从上面两个内联数组注释是程序员中最受欢迎的方式。

Answer 2

我建议使用https://github.com/olov/ng-annotate。它允许您编写如下代码。

angular.module("MyMod").controller("MyCtrl", function($scope, $timeout) {
});

然后ngAnnotate将其转换为以下内容，这对于缩小是安全的。

angular.module("MyMod").controller("MyCtrl", ["$scope", "$timeout",   function($scope, $timeout) {
}]);

Answer 3

minifyer保持弦不变，这就是我们使用数组符号的原因。链接方法不会改变minifyer保持字符串完整的方式。

var app=module(myapp);
app.config(['$routeProvider', function($routeProvider){
 $routeProvider.dosomestuffs()
}]);

将缩小类似

var a=module(myapp);
a.config(['$routeProvider', function(b){
      b.dosomestuffs()
}]);

但由于＆＃39; $ routeProvider＆＃39;而且棱角分明仍然会找到方向。串。

Answer 4

如果你总是使用注释，那么缩小角度脚本应该没有问题。

app.controller(['$scope', function(mrScope) {
    mrScope.yourProperty = 'it does not matter the dependency variable names if you use annotations'; 
}]);

Answer 5

只要对正在注入的依赖项使用数组表示法，就不会出现缩小问题。您正在使用的缩小工具应该可以轻松处理您的任何示例（在我的项目中，我们使用uglify来完成此操作）。

事实上，对于奇怪命名的注入（以点和字符命名导致无效的函数名称，如ABC.CDE），数组符号是注入它们的最佳方式。

Answer 6

我在缩小时遇到了同样的问题，和你一样，它只对$routeProvider配置元素失败了。我的答案是使用像Himanshu这样的$inject方法来说明我的配置，即使您为第一个示例显示的语法适用于我的控制器。因此，我会在此处发布我的.config()代码，因为我没有在上面的答案中明确列出它：

var app = angular.module('myApp');
var RouteProviderConfig = function ($routeProvider) {
        $routeProvider
            .when(...)
            .otherwise(...);
    };
RouteProviderConfig.$inject = ['$routeProvider'];
app.config(RouteProviderConfig);

这修复了我的配置错误，但我的控制器的工作方式与第一个示例相同：

app.controller('ctrl',['$rootScope',function($rootScope){
    ...
}]);

Angular Documentation似乎暗示两种方式都应该有效，所以我认为可能存在配置错误，或$routeProvider或其他完全错误......

缩小角度

6 个答案: