title: AngularJS 1.4.8 $injector:Modulerr Module Error
body: <p>I am relatively new to AngularJS and am getting an "Uncaught Error: [$injector:modulerr]". In addition, I am getting several syntax errors on the first line of various js files. </p>
  
  <p><a href="http://i.stack.imgur.com/Zh9Wd.png" rel="nofollow">error screenshot</a></p>
  
  <p><a href="https://docs.angularjs.org/error/$injector/modulerr?p0=userApp&amp;p1=Error:%20%5B$injector:nomod%5D%20http:%2F%2Ferrors.angularjs.org%2F1.4.8%2F$injector%2Fnomod%3Fp0%3DuserApp%0A%20%20%20%20at%20Error%20(native)%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:6:416%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:24:186%0A%20%20%20%20at%20b%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:23:251)%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:23:494%0A%20%20%20%20at%20https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:38:117%0A%20%20%20%20at%20n%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:7:333)%0A%20%20%20%20at%20g%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:37:488)%0A%20%20%20%20at%20eb%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:41:249)%0A%20%20%20%20at%20c%20(https:%2F%2Fcdnjs.cloudflare.com%2Fajax%2Flibs%2Fangular.js%2F1.4.8%2Fangular.min.js:19:463" rel="nofollow">error link</a></p>
  
  <p>I can't seem to remedy the situation, any thoughts?</p>
  
  <p>index.html</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;title&gt;User CRM&lt;/title&gt;
  
    &lt;!-- FOR ANGULAR ROUTING --&gt;
    &lt;base href="/"&gt;
  
    &lt;!-- CSS --&gt;
    &lt;!-- load bootstrap from CDN and custom CSS --&gt;
    &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"&gt;
    &lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.4.0/animate.min.css"&gt;
    &lt;link rel="stylesheet" href="public/assets/css/style.css"&gt;
  
    &lt;!-- JS --&gt;
    &lt;!-- load angular and angular-route via CDN --&gt;
    &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-route.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular-animate.js"&gt;&lt;/script&gt;
  
    &lt;!-- controllers --&gt;
    &lt;script src="public/app/controllers/mainCtrl.js"&gt;&lt;/script&gt;
    &lt;script src="public/app/controllers/userCtrl.js"&gt;&lt;/script&gt;
  
    &lt;!-- services --&gt;
    &lt;script src="public/app/services/authService.js"&gt;&lt;/script&gt;
    &lt;script src="public/app/services/userService.js"&gt;&lt;/script&gt;
  
    &lt;!-- main Angular app files --&gt;
    &lt;script src="public/app/app.js"&gt;&lt;/script&gt;
    &lt;script src="public/app/app.routes.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body ng-app="userApp" ng-controller="mainController as main"&gt;
  
    &lt;!-- NAVBAR --&gt;
    &lt;header&gt;
  
      &lt;div class = "navbar navbar-inverse" ng-if="main.loggedIn"&gt;
        &lt;div class="container"&gt;
          &lt;div class="navbar-header"&gt;
            &lt;a href="/" class="navbar-brand"&gt;&lt;span class="glyphicon glyphicon-fire text-danger"&gt;&lt;/span&gt; User CRM&lt;/a&gt;
          &lt;/div&gt;
          &lt;ul class="nav navbar-nav"&gt;
            &lt;li&gt;&lt;a href="/users"&gt;&lt;span class="glyphicon glyphicon-user"&gt;&lt;/span&gt; Users&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
          &lt;ul class="nav navbar-nav navbar-right"&gt;
            &lt;li ng-if="!main.loggedIn"&gt;&lt;a href="/login"&gt;Login&lt;/a&gt;&lt;/li&gt;
            &lt;li ng-if="main.loggedIn" class="navbar-text"&gt;Hello {{ main.user.name }}!&lt;/li&gt;
            &lt;li ng-if="main.loggedIn"&gt;&lt;a href="#" ng-click="main.doLogout()"&gt;Logout&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
    &lt;/header&gt;
  
    &lt;main class="container"&gt;
      &lt;!-- ANGULAR VIEWS --&gt;
      &lt;div ng-view&gt;&lt;/div&gt;
    &lt;/main&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>app.js</p>
  
  <pre><code>angular.module('userApp', [
    'ngAnimate', // add animations to our Angular Directives
    'app.routes', // routing for our application
    'authService', // service file
    'mainCtrl', // main view controller
    'userCtrl', // controller for user management pages
    'userService' //service file
  ]);
  </code></pre>
  
  <p>app.routes.js</p>
  
  <pre><code>angular.module('app.routes', ['ngRoute'])
  
  .config(function($routeProvider, $locationProvider) {
    $routeProvider
  
    // home page route
    .when('/', {
      templateUrl: 'app/views/pages/home.html'
    })
  
    // login page
    .when('/login', {
      templateUrl: 'app/views/pages/login.html',
      controller: 'mainController',
      controllerAs: 'login'
    })
  
    // get rid of the hash in the URL
    $locationProvider.html5Mode(true);
  
  });
  </code></pre>