I’m new to aurelia. In development, my app works as expected. I click a link like with an href like ‘#/stuff’ and it loads the stuff page. In production, clicking the same link causes the entire page to reload and I end up back at the initial state. I’m still figuring out how to debug this and it’s quite slow as deployments to production/staging take some time but I can’t reproduce it in development.
No idea if this is significant, but I host my aurelia app at a url like someurl.com/app
Your prod Server needs to be configured for Push state. How are you serving the Frontend?
Note you have a prefix /app in production url. You can try to set your local dev to follow production to avoid hiccup.
In index.html head section, you need
<base href="/app">
And in your app.js configureRouter, turn on pushState and set root path to match the base href in html head.
config.options.pushState = true;
config.options.root = '/app';
I had the base tag set but not the config options for pushState and root. After adding those lines it all seems to work! Now I’m trying to understand the magic behind these options. I presume some apps work without pushState or it would not be an option. Why was it working in development without pushState and not production? Both use the same base url.
You should use pushState unless you want to support IE.
The other limitation is if you want to deploy an app directly through GitHub Pages, you’d better turn off pushState. Otherwise, it will give you 404 if you reload http://your-username.github.com/your-repo/font-end/route/path.
No idea 
It seems to have something to do with switching roots. I have a login root that gets switched to a app with a router. In production without pushState, that change in root seems to cause the problem. If I remove the login stuff and go straight to the app root, it works. Anyway, I’m using pushState now and it all seems to work fine.