histórico vue.js vs modo hash em um subcaminho

Caso você esteja montando seu Vue Router não na página raiz, mas um "subcaminho", há uma diferença importante no comportamento do Vue Router na história e no modo hash.

Modo Histórico

Se você quiser, por exemplo, usar https://picockpit.local/debug/ para ter o Vue Router ao vivo, em modo de histórico:

As seguintes rotas

{ caminho: '/', componente: DebugOne},

{ caminho: '/dois', componente: DebugTwo},

{ caminho: '*', componente: FourOhFour}

não vai funcionar como esperado! (A sua página 404 usando a captura tudo será exibido).

Você terá que modificá-los para incluir o subcaminho (debug):

{ caminho: '/debug/', componente: DebugOne},

{ caminho: '/debug/two', componente: DebugTwo},

{ caminho: '*', componente: FourOhFour}

Neste caso, você poderá acessar os seguintes URLs:

• https://picockpit.local/debug/
• https://picockpit.local/debug/two

Modo Hash

No modo hash é exactamente o oposto. Você precisará usar as rotas como a seguir:

{ caminho: '/', componente: DebugOne},

{ caminho: '/dois', componente: DebugTwo},

{ caminho: '*', componente: FourOhFour}

Neste caso, você poderá acessar os seguintes URLs:

• https://picockpit.local/debug/#/
• https://picockpit.local/debug/#/two