angularjs - Grails Asset Pipeline 没有给出正确的 Javascript 顺序

Question

我正在 Grails 3.1.5 上创建一个 Angular 应用程序，而 Assets 管道没有给我所需的 Javascript 文件排序。我有以下 Javascript 文件:
angello.js

//= require /angular/angular
//= require /angular-route/angular-route
//= require /angello/core/angello.core
//= require /angello/index/angello.index
//= require /angello/common/angello.common
//= require /angello/storyboard/angello.storyboard

var myModule = angular.module("Angello", [
    "angello.core",
    "angello.index",
    'ngRoute',
    'Angello.Common',
    'Angello.Storyboard'
]);

myModule.config(function($routeProvider) {
    $routeProvider
        .when('/', {
            templateUrl: 'assets/angello/storyboard/tmpl/storyboard.html',
            controller: 'StoryboardCtrl',
            controllerAs: 'storyboard'
        })
});
myModule.controller('MainCtrl', function() { });

angello.storyboard.js

//= require_tree services
//= require_tree controllers
//= require_tree directives
//= require_tree templates
//= require_self

angular.module('Angello.Storyboard', ['Angello.Common']);

storyboardController.js

//= require /angular/angular
//= require /angello/storyboard/angello.storyboard
//= require_self

angular.module('Angello.Storyboard')
    .controller('StoryboardCtrl', function() {
        var storyboard = this;
    });

我将所有这些都包含在我的主要 GSP 中 <asset:javascript src="angello.js" />渲染 HTML 时，JS 文件的顺序不是我所期望的:

<script type="text/javascript" src="/assets/angular/angular.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angular-route/angular-route.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angular/angular-resource.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/core/angello.core.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/core/services/DomainServiceFactory.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/index/angello.index.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/index/services/applicationDataFactory.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/index/controllers/indexController.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angular/ui-bootstrap-tpls.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/common/angello.common.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/storyboard/controllers/storyboardController.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello/storyboard/angello.storyboard.js?compile=false" ></script>
<script type="text/javascript" src="/assets/angello.js?compile=false" ></script>

问题是 StoryboardJS文件的包含顺序与我需要的顺序相反，导致 Angular 提示
Error: [$injector:nomod] Module 'Angello.Storyboard' 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.
我认为这是我构建依赖指令的方式中的一个问题。我尝试了很多不同的东西，但似乎没有什么影响顺序。

Answer 1

module用于创建像 controller 这样的工件, service等必须在加载依赖项之前先加载。在上述情况下，在模块本身之前需要 Controller 。

因此，当需要 Controller (styoryBoardController.js) 时，它会提示模块不存在。

搬家//= require_self到 angello.storyboard.js 中的顶部将确保首先需要模块本身，然后是依赖项。