如何解决内置AngularJS应用程序依赖问题？ [英] How to solve dependency issues with built AngularJS app?

问题描述

我是新来AngularJS和正在创建将使用咕噜构建的应用程序。

I'm new to AngularJS and am creating an app which will be built using Grunt.

当我构建和运行我的应用程序，我注意到有关依赖的加载顺序一些问题：

When I build and run my app, I'm noticing some issues related to dependency load order:

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 

在内置的应用程序文件，正在被宣布之前使用的模块：

In the built app file, the module is being used before it is declared:

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

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

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

下面是从我的项目的gruntfile.js相关片段：

Here are pertinent snippets from my project's 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'
        }
    }
    ...
});

我知道我可以把所有的源给定模块到一个文件中解决这个问题;不过，我想尽量保持每一件事情（每个控制器，每个服务等），在它自己的文件。

I know I can solve this by putting all source for a given module into one file; however, I'd like to try and keep each thing (each controller, each service, etc.) in its own file.

我该如何解决这种依赖的加载顺序问题？

How can I solve this dependency load order issue?

推荐答案

什么顺序串联的呼噜声在你的文件吗？它看起来像你只是读一个目录，如果JavaScript文件模块声明是是控制器是那么串联文件会以错误的顺序建成后的文件。

What order is grunt concatenating your files in? It looks like you're just reading a directory, and if the javascript file that module declaration is in is after the file that the controller is in then the concatenated file will be built in the wrong order.

大概是最简单的解决方案是明确列出包含您的模块声明（带[]）作为源数组的第一个文件的文件。

Probably the simplest solution is to explicitly list the file that contains your module declaration (with []) as the first file in your source array.

这篇关于如何解决内置AngularJS应用程序依赖问题？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！