Question

我正在使用Grunt并执行cmd“grunt build”来创建包含AngularJS应用程序的分发文件夹。

作为一个独立的我的应用程序工作正常。一旦我为应用程序创建了一个发行版，应用就会很快崩溃。

我在F12工具控制台中看到的是：

达到10 $ digest（）迭代次数。中止！

我怀疑我的.tmp目录中有一个名为vendor.js的文件，并且因为控制器依赖注入变量错误地将注册控制器参数（例如“$ scope”）注入“a”而无法正确缩小，uglify和/或连接此文件例如，即使我正在使用ngAnnotate。

请参阅我正在使用UglifyJs并在Uglify和Concat之前调用ngAnnotate但是我无法从useMinPrepare中删除UglifyJs，或者我还有其他错误，例如甚至没有在我的dist目录中创建脚本目录：

useminPrepare: {
  html: '<%= yeoman.app %>/index.html',
  options: {
    dest: '<%= yeoman.dist %>',
    flow: {
      html: {
        steps: {
          js: ['concat', 'uglifyjs'],
          css: ['cssmin']
        },
        post: {}
      }
    }
  }
},

我在我的GruntJs文件中设置mangle = false但我怀疑useMinPrepare js: ['concat', 'uglifyjs']更改执行顺序并在调用useMin时运行ngAnnotate之前运行uglify，即使我调用{在useMin之后{1}}。

我是Grunt的新手，这个应用程序已经从另一位开发人员那里传递给我。

我发现这篇文章对我来说并不完全有意义，也不是一个似乎适用于我的Gruntfile.js的代码更改，但我想也许我还在做些什么：

https://github.com/DaftMonk/generator-angular-fullstack/issues/164

我已将Uglify mangle选项设置为false，但尚未解决我的问题。

这是我的Gruntfile.js代码：

ngAnnotate

Answer 1

所以我走错了道路，认为平滑是因为Uglify或连续或缩小。

grunt serve未发生错误，但仅在使用grunt build:dist

创建dist包后才会发生错误

因此，在我创建一个dist包之前，我的Angular应用程序DID工作正常，这是欺骗。

问题在于我，我最初在Index.html文件中有一个<ng-include src="'scripts/navigation/navigationMobile.html'"></ng-include>元素。

在某些时候，我创建了一个使用相同<my-nav></my-nav>的自定义元素指令templateUrl = scripts/navigation/navigationMobile.html，但我忘记从我的Index.html删除<ng-include src="'scripts/navigation/navigationMobile.html'"></ng-include>元素<my-nav></my-nav>打算取代。

无论出于何种原因， 10 $ digest（）迭代达到了。中止！仅在运行grunt build并创建缩小的Uglified vendor.js文件后才发生，在使用grunt serve进行开发和测试时没有发生，但我不知道确切的原因错误仅在grunt build之后出现。

也许有人可以回答这个问题。

Answer 2

我注意到我们需要在两种情况下给出ng-annotate的提示：

子类（ES6类）当超类在构造函数和子类上有注入时没有构造函数;
$ get提供商的方法

摘要检查中的错误来自仅在grunt build中运行的任务，或者与您从ng-include创建指令有关。

当您从ng-include更改为将其作为指令的模板时，angular将暂停编译，直到下一个摘要，最后加载模板时，即使它已经在$ templateCache中。

参考：https://docs.angularjs.org/api/ng/service/ $ compile（参见templateUrl）

作为最后一点，我已经看过了ngtemplates，因为它避免了通过线路的请求，并且当它们来自外部资源时角度编译模块乱序，它可能是一个bug你对该指令或其任何父节点的实现，它没有正确调用$ compile。

Answer 3

要解决此错误，只需打开Gruntfile.js文件，并在任务cssmin和任务uglify中添加extDot：'last'行。

例如：

cssmin: {
    all: {
        files: [{
            expand: true,
            cwd: srcDir,
            src: '**/*.css',
            dest: buildDir,
            ext: '.min.css',
            extDot: 'last'
        }]
    }
},
...
uglify: {
    all: {
        files: [{
            expand: true,
            cwd: srcDir,
            src: ['**/*.js', '!**/*-spec.js'],
            dest: buildDir,
            ext: '.min.js',
            extDot: 'last'
        }]
    }
},

Grunt构建导致Angular应用程序在dist上崩溃

3 个答案: