【问题标题】:Angular controller minification角度控制器缩小
【发布时间】:2025-12-13 23:25:02
【问题描述】:

我创建了一个基于 ng-boilerplate 的应用程序。一切正常。但是,现在我即将部署,我想编译和缩小代码。这使用 grunt compile 已经足够简单了,但是应用程序在缩小时当然会中断。我没想到会少!

我已将依赖项注入到我的控制器中,如下所示:

var appCtrl = app.controller('AppCtrl', function AppCtrl($scope, $rootScope, helpService, userService, menuService, $location) {... body ...});

appCtrl.$inject = ['$scope', '$rootScope', 'helpService', 'userService', 'menuService', '$location'];

我也试过这样:

 var appCtrl = app.controller('AppCtrl', ['$scope', '$rootScope', 'helpService', 'userService', 'menuService', '$location',
 function AppCtrl($scope, $rootScope, helpService, userService, menuService, $location) {... body ...}]);

我得到的只是这样的错误:错误:未知提供者:aProvider

我还查看了我的服务并以与上述第二种方法类似的方式注入了依赖项,但随后我开始在程序中出现错误,即使它没有被缩小。它告诉我 $q 没有方法 defer()!

app.factory('checkAuth',  ['$q', '$location', '$filter', '$rootScope', function ($q, $location, $filter, $rootScope) {...body...}]);

我的问题是,我错过了什么?我是否正确地进行了依赖注入?还有其他地方需要 DI 吗?

谢谢!

编辑: 刚刚发现这个:Angular.module minification bug

它还没有完全解决问题...我现在收到错误:

TypeError: Object #<error> has no method 'slice' 

但至少这是远离错误:未知提供者:aProvider

【问题讨论】:

  • 第二和第三看起来有效。你是否在你的应用中包含了 ngResource 模块?

标签: angularjs


【解决方案1】:

您的第二种方法是使用 angular 的内联注释方法,并且应该能够正确缩小。

由于 Angularjs 如何处理它的依赖注入,其他方法将不起作用 - 它会查看参数的名称来确定提供者。您的 minifier 会将参数名称从 $scope 更改为 a,并且 Angjuar 将尝试为 a 查找提供程序。内联样式以更多的打字和更多的维护为代价来解决这个问题。 (有一个工具可以改变你的角度代码,这样它就可以在这里被 grunt 缩小:https://github.com/btford/ngmin

我希望您的问题是您的控制器或模块并非所有都被更改为使用内联样式,并且您继续收到错误。确保更改所有内容 - 阅读 Angularjs DI,尤其是内联注释。

【讨论】:

  • 谢谢!我在下面添加了一个答案,以便可以对其进行格式化。
【解决方案2】:

好的 - 修复它:我将过滤器更改为返回文本而不是像这样的布尔值:

function orgFilter(item, args) {
    if ((args.searchString !== "" && item["strName"].indexOf(args.searchString) == -1) &&
        (args.searchString !== "" && item["strShortName"].indexOf(args.searchString) == -1) &&
        (args.searchString !== "" && item["strCode"].indexOf(args.searchString) == -1)
        ) {
//            return false;
        return 'continue_coreloop';
    }
//        return true;
    return 'add_result';
}

...然后更改compileFilter()函数以匹配文本

  var filterBody = filterInfo.body
      .replace(/return \'continue_coreloop\'[;}]/gi, "{ continue _coreloop; }")
      .replace(/return \'add_result\'[;}]/gi, "{ _retval[_idx++] = $item$; continue _coreloop; }")
      .replace(/return ([^;}]+?);/gi,
      "{ if ($1=='add_result') { _retval[_idx++] = $item$; }; continue _coreloop; }");

Uglify 不会更改文本值,因此匹配仍然为真。

【讨论】: