AngularJS缩小了js文件无法正常工作

Question

我将所有js文件缩小并合并为一个并包含在html中，没有任何内容在网站中工作。

js中有这么多文件，我不希望一个接一个地包含所有文件，所以修改并合并为一体。

还有其他方法可以减少js文件的http调用次数。

Answer 1

在缩小AngularJS文档时，请务必遵循文档进行依赖注入，否则您的代码可能会中断。您应该确保使用首选的数组方法，可以在下面看到一个示例：

   someModule.controller('MyController', ['$scope', 'greeter', function($scope, greeter) {
  // ...
}]);

正如官方Angular JS文档中所见：https://docs.angularjs.org/guide/di。

Answer 2

看来，这是implicit dependency injection的原因。根据Angular JS文档：

  

小心：如果您计划缩小代码，您的服务名称将被重命名并破坏您的应用。

请改用strict dependency injection。例如：

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

此外，请考虑使用ng-annotate更容易：

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

Answer 3

要跟进@ dayle-salmon的答案，如果你有这样的控制器

app.controller('DemoCtrl', function(dependency1, dependency2){
 // controller code
});

将其更改为

app.controller('DemoCtrl', ['dependency1', 'dependency2', function(dependency1, dependency2){
 // controller code
}]);

原因 JS minificators通常会更改注入的依赖项的名称。 Angular不会对依赖是什么有所了解。因此，您手动声明它们以便在缩小后不会导致问题！