Problema di configurazione del routing Aurelia

Question

Ho riscontrato un problema con la configurazione del percorso di Aurelia quando il percorso come layer1/layer2 non solo layer1. Qui è la struttura del file di progetto (file sotto dist viene creato automaticamente in base file nella cartella src)

dist 
    | - home 
     | - home.html 
     | - home.js 
    | - user 
     | - register.html 
     | - register.js 
    app.html 
    app.js 
    main.js 
src 
    | - home 
     | - home.html 
     | - home.js 
    | - user 
     | - register.html 
     | - register.js 
    app.html 
    app.js 
    main.js 

Quando faccio la seguente funziona bene:

app.html

<template> 
 
    <div> 
 
    <a href="user">register user</a> 
 
    <a href="otherlink">otherlink</a> 
 
    </div> 
 
    <div class='main'> 
 
    <router-view></router-view> 
 
    </div> 
 
</template>

app.js

this.router.configure(config => { 
 
    config.title = 'demo'; 
 
    config.options.pushState = true; 
 
    config.map([ 
 
    // home routes 
 
    { route: ['','home'], moduleId: './home/home', nav: true, title:'Home' }, 
 

 
    // User register 
 
    { route: ['user'], moduleId: './user/register', nav: true, title:'Register User'} 
 
    ]); 
 
});

Ma quando cambio il percorso da utente-utente/Registrazione come qui di seguito, non funziona più

app.html

<template> 
 
    <div> 
 
    <a href="user/register">register user</a> 
 
    <a href="otherlink">otherlink</a> 
 
    </div> 
 
    <div class='main'> 
 
    <router-view></router-view> 
 
    </div> 
 
</template>

app.js

this.router.configure(config => { 
 
    config.title = 'demo'; 
 
    config.options.pushState = true; 
 
    config.map([ 
 
    // home routes 
 
    { route: ['','home'], moduleId: './home/home', nav: true, title:'Home' }, 
 

 
    // User register 
 
    { route: ['user/register'], moduleId: './user/register', nav: true, title:'Register User'} 
 
    ]); 
 
});

E nel debugger cromato, vedo questo errore:

GET http://localhost:9000/utente/dist/user/register.html 404 (non trovato)

Si noti che in qualche modo un utente aggiuntivo viene aggiunto all'URL che non riesce a trovare il file register.html. Anche in questo caso, quando utilizzo semplicemente come route, funziona senza errori, ma quando cambio da utente a utente/registro, non funziona più.

Qualcuno potrebbe farmi sapere perché questo sta accadendo e come risolverlo?

Answer 1

Modificare il href per il collegamento da href="#/user/register" e questo dovrebbe risolvere il problema per voi.

Non ho visto che hai attivato pushState. Si prega di modificare il index.html e aggiungere

<base href="http://localhost:9000/"> 

O qualunque sia il vostro URL principale è. Questo dovrebbe risolvere il problema per te.

Answer 2

Ho apportato una piccola modifica alla risposta di Ashley, che rende un pochino più rispettosa dell'ambiente dal momento che non è necessario l'URL locale del codice rigido. L'ho provato e funziona bene anche io.

<base href="/">