WARNING: Tried to load angular more than once. Angular JS

Question

I am trying to view my app after running Grunt Build. I use grunt serve:dist to see all production ready build but in the browser I get an infinite loop saying:

Answer 1

Just to add one more possible scenario to this issue...

Behavior: everything works fine when loaded from the root URL, but you run into this issue whenever loading your page from any other route (or entering another route).

Likely reason: one of your nested components or pages is loading something from a relative path instead of an absolute path.

In my case it had to do with a referenced component loading its template with a relative path.

So, for example changing from this:

angular.
  module('app').
  component('profileSelect', {
    // this line was the problem
    templateUrl: 'static/angular/profiles/profile-select.html',
    bindings: {}
  });

to this:

angular.
  module('app').
  component('profileSelect', {
    // making this an absolute path fixes it
    templateUrl: '/static/angular/profiles/profile-select.html',
    bindings: {}
  });

Resolved it. Basically because you now have sub-paths those relative references no longer work, and angular decides to fail in this incredibly hard-to-decipher way.

Hopefully someone is helped by this answer. I just lost an hour+ of my life to it...