title: App Module Not Found AngularJS
body: <p>For some reason its giving me errors when i try to run this code. (i will post code then error at bottom):</p>
  
  <p>index.html:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  
  &lt;head&gt;
      &lt;meta id="meta" name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /&gt;
      &lt;link href='https://fonts.googleapis.com/css?family=RobotoDraft:400,500,700,400italic' rel='stylesheet' type='text/css'&gt;
      &lt;link rel="stylesheet" href="assets/dist/css/vendor.min.css" type="text/css" /&gt;
      &lt;link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.9/angular-material.min.css" /&gt;
      &lt;script type="text/javascript" src="assets/dist/js/vendor.min.js"&gt;&lt;/script&gt;
  
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-animate.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular-aria.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material/1.0.9/angular-material.min.js"&gt;&lt;/script&gt;
  
  
      &lt;link rel="stylesheet" href="global.css" type="text/css" /&gt;
  
  
      &lt;link href="https://code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet"&gt;
      &lt;script src="https://code.ionicframework.com/nightly/js/ionic.bundle.js"&gt;&lt;/script&gt;
  
  
  
      &lt;script type="text/javascript" src="app/app.module.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="app/app.route.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="assets/dist/js/app.min.js"&gt;&lt;/script&gt;
  
  
  &lt;/head&gt;
  
  
      &lt;body ng-app="Hive"&gt;
  
  
        &lt;div ui-view class="main_view"&gt;
        &lt;/div&gt;
  
  
     &lt;ion-tabs class="tabs-icon-top tabs-energized"&gt;
  
          &lt;ion-tab title="Home" icon="ion-home" ui-sref="home"&gt;
            &lt;ion-nav-view name="home-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
          &lt;ion-tab title="Discussions" icon="ion-android-contacts" ui-sref="discussions"&gt;
            &lt;ion-nav-view name="discussions-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
          &lt;ion-tab title="Board" icon="ion-ios-list-outline" ui-sref="board"&gt;
            &lt;ion-nav-view name="list-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
  
               &lt;ion-tab title="Me" icon="ion-android-happy" ui-sref="me"&gt;
            &lt;ion-nav-view name="profile-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
        &lt;/ion-tabs&gt;
  
  
    &lt;/body&gt;
  
  
  &lt;/html&gt;
  </code></pre>
  
  <p>app.module.js:</p>
  
  <pre><code>(function (angular) {
      'use strict';
      angular.module('Hive', [
              'ionic',
              'firebase',
              'ngMaterial'
          ]
      );
  
  });
  </code></pre>
  
  <p>app.route.js:</p>
  
  <pre><code>(function (angular) {
      'use strict';
  
      angular.module('Hive')
          .config(stateParams)
  
      /* @ngInject */
      function stateParams($stateProvider, $urlRouterProvider) {
  
          $stateProvider
              .state('home', {
                  url: '/home',
                  templateUrl:'app/components/home/home.html',
                  controller: 'homeCtrl'
              })
  
              .state('me' , {
                  url:'/me',
                  templateUrl:'app/components/me/me.html',
                  controller:'meCtrl'
              })
  
              .state('discussions' , {
                  url:'/discussions',
                  templateUrl:'app/components/discussions/discussions.html',
                  controller:'discussionsCtrl'
              })
  
              .state('board', {
                  url:'/board',
                  templateUrl:'app/components/board/board.html',
                  controller:'boardCtrl'
              })
  
              .state('register', {
                  url:'/register',
                  templateUrl:'app/components/register/register.html',
                  controller:'registerCtrl'
              })
  
  
          $urlRouterProvider.otherwise('/home');
  
      }
  })(angular);
  </code></pre>
  
  <p>I am getting the following errors when i run the code:</p>
  
  <pre><code>Error: $injector:nomod
  Module Unavailable
  Module 'Hive' 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.
  
  Error: $injector:modulerr
  Module Error
  Failed to instantiate module Hive due to:
  Error: [$injector:nomod] http://errors.angularjs.org/1.2.7/$injector/nomod?p0=Hive
      at Error (native)
      at https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:3596
      at https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:10429
      at https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:10940
      at https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:14933
      at Array.forEach (native)
      at o (https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:3925)
      at r (https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:14873)
      at wt (https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:16490)
      at r (https://preview.c9users.io/amanuel2/hive/assets/dist/js/vendor.min.js:3:9097
  </code></pre>
  
  <p>I dont understand why i am getting these errors at all. I have been debugging for a long time now , but couldnt understand why. Right now im coding all this in website IDE : <a href="https://ide.c9.io/amanuel2/hive" rel="nofollow">https://ide.c9.io/amanuel2/hive</a>  . Help would be appreciated ! :)</p>
  
  <p>Edit (ngMaterial Not working ^^):
  index.html:
      
      </p>
  
  <pre><code>&lt;head&gt;
      &lt;meta id="meta" name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /&gt;
      &lt;link href='https://fonts.googleapis.com/css?family=RobotoDraft:400,500,700,400italic' rel='stylesheet' type='text/css'&gt;
      &lt;link rel="stylesheet" href="assets/dist/css/vendor.min.css" type="text/css" /&gt;
  &lt;link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.css"&gt;
      &lt;script type="text/javascript" src="assets/dist/js/vendor.min.js"&gt;&lt;/script&gt;
  
  
  
      &lt;!-- Angular Material requires Angular.js Libraries --&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-animate.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-aria.min.js"&gt;&lt;/script&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.3/angular-messages.min.js"&gt;&lt;/script&gt;
  
    &lt;!-- Angular Material Library --&gt;
    &lt;script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0-rc2/angular-material.min.js"&gt;&lt;/script&gt;
  
  
  
      &lt;link rel="stylesheet" href="global.css" type="text/css" /&gt;
  
  
      &lt;link href="https://code.ionicframework.com/nightly/css/ionic.css" rel="stylesheet"&gt;
      &lt;script src="https://code.ionicframework.com/nightly/js/ionic.bundle.js"&gt;&lt;/script&gt;
  
  
  
      &lt;script type="text/javascript" src="app/app.module.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="app/app.route.js"&gt;&lt;/script&gt;
      &lt;script type="text/javascript" src="assets/dist/js/app.min.js"&gt;&lt;/script&gt;
  
  
  &lt;/head&gt;
  
  
      &lt;body ng-app="Hive"&gt;
  
  
        &lt;div ui-view class="main_view"&gt;
        &lt;/div&gt;
  
  
     &lt;ion-tabs class="tabs-icon-top tabs-energized"&gt;
  
          &lt;ion-tab title="Home" icon="ion-home" ui-sref="home"&gt;
            &lt;ion-nav-view name="home-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
          &lt;ion-tab title="Discussions" icon="ion-android-contacts" ui-sref="discussions"&gt;
            &lt;ion-nav-view name="discussions-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
          &lt;ion-tab title="Board" icon="ion-ios-list-outline" ui-sref="board"&gt;
            &lt;ion-nav-view name="list-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
  
               &lt;ion-tab title="Me" icon="ion-android-happy" ui-sref="me"&gt;
            &lt;ion-nav-view name="profile-tab"&gt;&lt;/ion-nav-view&gt;
          &lt;/ion-tab&gt;
  
        &lt;/ion-tabs&gt;
  
  
    &lt;/body&gt;
  
  
  &lt;/html&gt;
  </code></pre>
  
  <p>app.module.js:</p>
  
  <pre><code>(function (angular) {
      'use strict';
      angular.module('Hive', [
              'ionic',
              'firebase',
              'ngMaterial'
          ]
      );
  
  })(angular);
  </code></pre>