Ошибка AngularJS: $ injector modulerr

Question

Я пытаюсь запустить простую CRM-приложение, основанную на веб-книге стека MEAN. После загрузки страницы я получаю следующее сообщение об ошибке в консоли:

Error: [$injector:modulerr] http://errors.angularjs.org/1.4.7/$injector/modulerr?p0=userApp&p1=%5B%24injector%3Amodulerr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.4.7%2F%24injector%2Fmodulerr%3Fp0%3DuserCtrl%26p1%3D%255B%2524injector%253Anomod%255D%2520http%253A%252F%252Ferrors.angularjs.org%252F1.4.7%252F%2524injector%252Fnomod%253Fp0%253DuserCtrl%250AI%252F%253C%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A6%253A416%250Ade%252F%253C%252F%253C%252F%253C%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A24%253A186%250Aa%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A23%253A252%250Ade%252F%253C%252F%253C%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A23%253A1%250Ah%252F%253C%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A37%253A427%250Am%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A7%253A320%250Ah%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A37%253A275%250Ah%252F%253C%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A37%253A444%250Am%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A7%253A320%250Ah%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A37%253A275%250Afb%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A41%253A35%250Azc%252Fd%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A19%253A463%250Azc%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A20%253A274%250AZd%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A19%253A83%250A%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A293%253A238%250Aa%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A174%253A399%250AHf%252Fc%2540http%253A%252F%252Flocalhost%253A8080%252Fassets%252Flibs%252Fangular%252Fangular.min.js%253A35%253A212%250A%0AI%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A6%3A416%0Ah%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A38%3A184%0Am%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A7%3A320%0Ah%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A37%3A275%0Ah%2F%3C%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A37%3A444%0Am%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A7%3A320%0Ah%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A37%3A275%0Afb%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A41%3A35%0Azc%2Fd%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A19%3A463%0Azc%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A20%3A274%0AZd%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A19%3A83%0A%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A293%3A238%0Aa%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A174%3A399%0AHf%2Fc%40http%3A%2F%2Flocalhost%3A8080%2Fassets%2Flibs%2Fangular%2Fangular.min.js%3A35%3A212%0A 


angular.min.js (line 6, col 416) 

Это мой app.js файл (основной модуль приложения)

angular.module('userApp', [ 
    'ngAnimate', 
    'app.routes', 
    'authService', 
    'mainCtrl', 
    'userCtrl', 
    'ngRoute', 
    'userService' 
    ]); 

и мой index.html:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>User CRM</title> 
     <base href="/"> 

     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootswatch/3.3.5/custom/bootstrap.min.css"> 
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css"> 
     <link rel="stylesheet" href="assets/cs/style.css"> 

     <script type="text/javascript" src="assets/libs/angular/angular.min.js"></script> 
     <script type="text/javascript" src="assets/libs/angular-route/angular-route.min.js"></script> 
     <script type="text/javascript" src="assets/libs/angular-animate/angular-animate.min.js"></script> 

     <script type="text/javascript" src="app/controllers/mainCtrl.js"></script> 
     <script type="text/javascript" src="app/controllers/userCtrl.js"></script> 

     <script type="text/javascript" src="app/services/authService.js"></script> 
     <script type="text/javascript" src="app/services/userService.js"></script> 

     <script type="text/javascript" src="app/app.routes.js"></script> 
     <script type="text/javascript" src="app/app.js"></script> 
    </head> 

    <body ng-app="userApp" ng-controller="mainController as main"> 
     <header> 
      <div class="navbar navbar-inverse" ng-if="main.loggedIn"> 
       <div class="container"> 
        <div class="navbar-header"> 
         <a href="/" class="navbar-brand"><span class="glyphicon glyphicon-fire text-danger"></span> User CRM</a> 
        </div> 
        <ul class="nav navbar-nav"> 
         <li><a href="/users"><span class="glyphicon glyphicon-user"></span> Users</a></li> 
        </ul> 
        <ul class="nav navbar-nav navbar-right"> 
         <li ng-if="!main-loggedIn"><a href="/login">Login</a></li> 
         <li ng-if="main.loggedIn" class="navbar-text">Hello {{ main.user.name }}!</li> 
         <li ng-if="main.loggedIn"><a href="#" ng-click="main.doLogout()">Logout</a></li> 
        </ul> 
       </div> 
      </div> 
     </header> 
     <main class="container"> 
      <div ng-view></div> 
     </main> 
    </body> 
</html> 

Я загрузил локальные зависимости с помощью беседки (угловой, угловой, угловой-анимат), а остальные локальные .js-файлы, поэтому я не могу понять, в чем проблема.

Весь проект можно найти здесь Git Repo. Угловая часть кода находится в/общей папке.

Любые отзывы/идеи оценены.

Answer 1

Вы пытаетесь внедрить userCtrl в вашем приложении, я не мог найти его в мерзавца репо вы

angular.module('userApp', [ 
'ngAnimate', 
'app.routes', 
'authService', 
'mainCtrl', 
'userCtrl', 
'ngRoute', 
'userService' 
]); 

Угловая DI, ищет сервис/контроллер/фабрики любой компонент, имена userCtrl, которую он не может найти.

Угловой DI не ищет файлы, а скорее компоненты со строковыми именами ваших компонентов.

Answer 2

Ваш контроллер и ваши услуги должны быть частью вашего модуля userApp, а не разделять MainCtrl или userService.

Изменить

// This declares a new module named 'mainCtrl' 
angular.module('mainCtrl', []) 

angular.module('userService', []) 

angular.module('autService', []) 

в

angular.module('userApp')