Sto iniziando un nuovo progetto vue.js, quindi ho usato lo strumento vue-cli per creare un nuovo progetto webpack (ad es vue init webpack
.).
Mentre stavo camminando attraverso i file generati ho notato le seguenti importazioni nel src/router/index.js
file:
import Vue from 'vue'
import Router from 'vue-router'
import Hello from '@/components/Hello' // <- this one is what my qusestion is about
Vue.use(Router)
export default new Router({
routes: [
{
path: '/',
name: 'Hello',
component: Hello
}
]
})
Non ho mai visto il segno at ( @
) in un percorso prima. Ho il sospetto che consenta percorsi relativi (forse?) Ma volevo essere sicuro di capire cosa fa veramente.
Ho provato a cercare online ma non sono riuscito a trovare una spiegazione (probabilmente perché cercare "al segno" o usare il carattere letterale @
non aiuta come criteri di ricerca).
Cosa fa @
in questo percorso (il collegamento alla documentazione sarebbe fantastico) ed è una cosa es6? Una cosa da webpack? Una cosa da caricatore di vue?
AGGIORNARE
Grazie Felix Kling per avermi indicato un'altra domanda / risposta stackover duplicata su questa stessa domanda.
Mentre il commento sull'altro post di StackOverflow non è la risposta esatta a questa domanda (non era un plug-in babel nel mio caso), mi ha indirizzato nella direzione corretta per trovare quello che era.
Nell'impalcatura che vue-cli fa per te, parte della configurazione webpack di base imposta un alias per i file .vue:
Questo ha senso sia nel fatto che ti dà un percorso relativo dal file src e rimuove il requisito del .vue
alla fine del percorso di importazione (che normalmente hai bisogno).
Grazie per l'aiuto!