Vous avez sans doute souvent vu dans un script javascript moderne ceci:
import Component from '@/components/component'
Normalement si on veut importer un module Javascript, il faut utiliser les / et les .. soit pour remonter d’un niveau soit pour descendre d’un niveau, comme on le ferait dans n’importe quel langage de programmation.
Cette notation n’est pas du Javascript natif, elle est rendue possible par l’utilisation d’un plugin de type module loader ou module bundler.
C’est un plugin comme babel plugin root import, qui permet d’avoir cette syntaxe. Mais de quel root? le root du projet javascript en question. Ainsi quelque soit l’emplacement du plugin et de la page qui demande le plugin, on utilisera l’arobase pour atteindre un plugin comme si on le demandait depuis la racine du projet.
Cela permet d’éviter que la syntaxe suivante :
import Component from 'components/component'
Dans ce cas ça va chercher dans /node_modules.
Si on cherche un module dans le projet
import Component from './components/component'