tommyd456 tommyd456 - 1 year ago 126
Node.js Question

HTML5 mode - ui-router - Uncaught SyntaxError: Unexpected token <

Trying hard to get html5 mode to play nicely with ui-router but there just seems to be loads of problems

One I can't get around at the moment is very strange so any suggestions appreciated.

I have these states:

.state('app', {
url: '/app',
templateUrl: 'views/app/app.html',
resolve: {
loggedin: checkLoggedin
.state('', {
url: "/docs",
templateUrl: "views/app/",
controller: "DocsController"

.state('app.create-doc', {
url: "/docs/create",
templateUrl: "views/app/app.editor.html",
controller: "DocController"

.state('app.edit-doc', {
url: "/docs/:short",
templateUrl: "views/app/app.editor.html",
controller: "DocController"

.state('app.account', {
url: "/account",
templateUrl: "views/app/app.account.html",
controller: "AccountController"

When NOT in html5 mode (using the hashbang), and I navigate to
everything works fine with no errors in the console.

However, when IN html5 mode and I navigate to
I get a whole load of errors in the console stating
Uncaught SyntaxError: Unexpected token <
for each of my Controllers and Services.

enter image description here

I'm sorry I can't be more detailed on this but I simply haven't got a clue what's causing the issue???

Answer Source

One big thing to look at is your URLs. Try putting a '/' in front of both your templateUrls and your Javascript include URLs so they're absolute URLs. That error is very common when the browser tries to access a JS file and it gets HTML back (usually a 404 page) instead.

As soon as you start viewing a URL like "/docs/create" the browser is going to treat relative URLs as sub-paths under there, and can easily lead to this error if you aren't trapping for it. (Looking at the Network tab in your debugger above could help confirm this.)

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download