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) {

    // ...

  }]);

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?