Menu
I've run into an issue that I can't seem to resolve.
It should be possible to remove the preceding hashtag in routes by executing the steps provided in RouterConfiguration -> Options-> Push State.
I've executed all these steps, see the code below.
app.ts RouterConfiguration options
public configureRouter(config: RouterConfiguration, router: Router) {
config.options.pushState = true;
config.options.root = '/';
config.map([
{
route: 'login',
name: 'login',
moduleId: 'pages/auth/login',
nav: false,
title: 'Login',
settings: {
allow_anonymous: true
}
}
]);
...
index.html head
<head>
<meta charset="utf-8">
<base href="/">
...
config.js
System.config({
baseURL: "/",
...
My login route still only works using localhost:9000/#/login whereas localhost:9000/login can't be found.
I've also tried implementing this in a fresh Aurelia JSPM skeleton application to no avail...
Any idea why this is happening and what I might be doing wrong?
795
For BrowserSync (as described by @Bryandh), you need to configure it to always fallback to your index.html. Depending on your project, you may have some task file(e.g. a Gulp serve task, which is used throughout Aurelia) which needs to be changed.
As an example, I took Aurelia's skeleton navigation project. It has a sub directory skeleton-esnext which uses Gulp and JSPM to run the application. In the file build/tasks/serve.js is a serve task which needs to be adjusted as follows:
var historyFallback = require('connect-history-api-fallback');
gulp.task('serve', ['build'], function(done) {
browserSync({
online: false,
open: false,
port: 9000,
server: {
baseDir: ['.'],
middleware: [function(req, res, next) {
res.setHeader('Access-Control-Allow-Origin', '*');
next();
}, historyFallback()]
}
}, done);
});
The important part is the historyFallback() middleware. This is provided automatically by BrowserSync. If you serve your app with this task now (gulp serve or gulp watch), you can directly access your routes, e.g. http://localhost:9000/users. There will be no more 404 as you get directed to index.html which bootstraps Aurelia and handles the route /users.
151
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
