如何解決內置AngularJS應用程序的依賴性問題？

Question

我是AngularJS的新手，正在創建一個使用Grunt構建的應用程序。

當我構建並運行我的應用程序時，我注意到與依賴項加載順序相關的一些問題：

Uncaught Error: [$injector:nomod] Module 'mycompany.admin.forms' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.2.13/$injector/nomod?p0=mycompany.admin.forms 

在構建的app文件中，模塊在聲明之前正在使用：

angular.module('mycompany.admin.forms').controller('editController', ['$scope', function($scope) {
    // ...
}]);

angular.module('mycompany.admin.forms', [])

  .config(['$routeProvider', function($routeProvider) {
    // ...
  }]);

以下是我項目的gruntfile.js中的相關片段：

grunt.initConfig({
    distdir: 'build',
    pkg: grunt.file.readJSON('package.json'),
    src: {
        js: ['src/**/*.js'],
    },
    concat: {
        dist: {
            src: ['<%= src.js %>', '<%= src.jsTpl %>'],
            dest: '<%= distdir %>/admin/app.js'
        }
    }
    ...
});

我知道我可以通過將給定模塊的所有源放入一個文件來解決這個問題; 但是，我想嘗試將每個事物（每個控制器，每個服務等）保存在自己的文件中。

如何解決此依賴性加載順序問題？

Answer 1

grunt連接文件的順序是什么？ 看起來你只是在讀一個目錄，如果模塊聲明所在的javascript文件位於控制器所在的文件之后，那么連接文件將以錯誤的順序構建。

可能最簡單的解決方案是明確列出包含模塊聲明的文件（帶[]）作為源數組中的第一個文件。

Answer 2

為了解決依賴性負載問題，我建議您使用Require.js

它與Angular的效果非常好，而且你還有一個用於構建的grunt插件 。