title: Angular.js: Uncaught error, no module: myapp
body: <p>I'm trying too bootstrap an angular.js project. This is my index.html:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html ng-app="myapp"&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;base href="{% url 'app' %}" /&gt;
  
      &lt;title&gt;Project&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div ng-view&gt;
          &lt;p&gt;Loading...&lt;/p&gt;
      &lt;/div&gt;
  
      &lt;script&gt;
          var url = function(path) { return '{{ STATIC_URL }}' + path };
      &lt;/script&gt;
      &lt;script src="{{ STATIC_URL }}js/jquery-1.10.1.js"&gt;&lt;/script&gt;
      &lt;script src="{{ STATIC_URL }}js/angular.js"&gt;&lt;/script&gt;
      &lt;script src="{{ STATIC_URL }}js/project/app.js"&gt;&lt;/script&gt;
      &lt;script src="{{ STATIC_URL }}js/project/controllers.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The <code>url 'app'</code> on the head simply prints the subpath, /app, for example. This is my app.js:</p>
  
  <pre><code>'use strict';
  
  var app = angular.module('myapp', []);
  
  app.config(['$routeProvider', function($router) {
      $router.when('/', {
          templateUrl: url('partials/foo.html'),
          controller: controllers.Foo
      });
  }]);
  </code></pre>
  
  <p>The problem is that everytime I try to run it, an exception is raised: <code>Uncaught Error: No module: myapp</code>, and this is almost the same way <a href="https://github.com/angular/angular-seed" rel="nofollow noreferrer">angular-seed</a> works. I searched on Google and StackOverflow but none of the answers (<a href="https://stackoverflow.com/questions/16585085/uncaught-error-no-module-myapp">one</a> and <a href="https://stackoverflow.com/questions/13531197/how-to-run-angularjs-example">two</a>) helped me.</p>
  
  <p>Here's a <a href="http://jsfiddle.net/vvfnN/" rel="nofollow noreferrer">fiddle</a> about my error (you should open the browser's console to see it). What's going wrong?</p>