Estou iniciando um novo projeto vue.js, então usei a ferramenta vue-cli para criar um novo projeto de webpack (ou seja,vue init webpack)

Enquanto eu andava pelos arquivos gerados, notei o seguinte, devido às importações nosrc/router/index.js Arquivo:

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
        }
    ]
})

Eu não vi o sinal de arroba (@) em um caminho antes. Eu suspeito que ele permita caminhos relativos (talvez?), Mas eu queria ter certeza de que entendi o que ele realmente faz.

Tentei pesquisar on-line, mas não consegui encontrar uma explicação (provavelmente porque pesquisava "arroba" ou estava usando o caractere literal@ não ajuda como critério de pesquisa).

O que faz o@ fazer neste caminho (link para documentação seria fantástico) e isso é uma coisa es6? Uma coisa do webpack? Coisa de vue-loader?

ATUALIZAR

Obrigado Felix Kling por me indicar outra pergunta / resposta duplicada sobre o stackoverflow sobre essa mesma pergunta.

Embora o comentário na outra postagem do stackoverflow não seja a resposta exata para essa pergunta (não era um plugin babel no meu caso), ele me apontou na direção correta para encontrar o que era.

Nos andaimes que o vue-cli cria para você, parte da configuração básica do webpack define um alias para os arquivos .vue:

Isso faz sentido, tanto no fato de fornecer um caminho relativo a partir do arquivo srce remove a exigência do.vue no final do caminho de importação (normalmente necessário).

Obrigado pela ajuda!