Module 'App' is not available! You either misspelled the module name or forgot to load it in AngularJS
<p>I'm developing a simple web application using angularJS and I'm running into this issue I cannot resolve. Running my website I get this error in console:</p>

<blockquote>
  <p>Uncaught Error: [$injector:modulerr] Failed to instantiate module App
  due to: Error: [$injector:nomod] Module 'App' 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.</p>
</blockquote>

<p>But I'm sure I didn't misspell the module name or forgot to load it. Here's my code:</p>

<pre><code>var App = angular.module('App', ['ngRoute', 'ngMaterial', 'ui-notification', 'ngFileUpload']);

App.run(['$rootScope', '$location', function($rootScope, $location) {
    console.log("TEST");
}]);
App.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    // TODO: routing
}]);

App.factory('file-uploader', ['Upload', function(Upload) {
    var uploadFile = function(file, callback) {
        var uploader;
        uploader = Upload.upload({
            url: 'SERVER URL' + '/upload-file',
            data: {
                image: file
            }
        });
        uploader.then(function(fileData) {
            return callback(null, fileData);
        });
        uploader.catch(function(error) {
            return callback(error, null);
        });
    };

    return uploadFile;
}]);
</code></pre>

<p>This is my index.html:</p>

<pre><code>&lt;!DOCTYPE html&gt;
&lt;html ng-app="App"&gt;
  &lt;head&gt;
    &lt;meta charset="utf-8"&gt;
    &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1"&gt;
    &lt;meta name="description" content=""&gt;
    &lt;meta name="author" content="AUTHOR"&gt;
    &lt;title&gt;PROJECT NAME | Login&lt;/title&gt;
    &lt;link rel="stylesheet" href="/bower_components/angular-material/angular-material.css"&gt;
    &lt;link rel="stylesheet" href="/bower_components/angular-ui-notification/dist/angular-ui-notification.min.css"&gt;
    &lt;link rel="stylesheet" href="css/main.css" type="text/css"&gt;
  &lt;/head&gt;
  &lt;body ng-class="location" ng-cloak&gt;
    &lt;div ng-view&gt;&lt;/div&gt;
    &lt;script defer src="/bower_components/angular/angular.js"&gt;&lt;/script&gt;
    &lt;script defer src="/bower_components/angular-route/angular-route.js"&gt;&lt;/script&gt;
    &lt;script defer src="/bower_components/angular-aria/angular-aria.js"&gt;&lt;/script&gt;
    &lt;script defer src="/bower_components/angular-animate/angular-animate.js"&gt;&lt;/script&gt;
    &lt;script defer src="/bower_components/angular-messages/angular-messages.js"&gt;&lt;/script&gt;
    &lt;script defer src="/bower_components/angular-ui-notification/dist/angular-ui-notification.min.js"&gt;&lt;/script&gt;
    &lt;script defer src="/bower_components/angular-material/angular-material.js"&gt;&lt;/script&gt;
    &lt;script defer src="/bower_components/jquery/dist/jquery.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>And I've installed all the packages with bower...</p>

<p>Can someone please tell me where is the problem and how can I solve it?</p>