Vueにおけるimportにおける@の役割

これはwebpackのパス別名であり、関連コードはプロファイルwebpackに定義される.base.configでは:

resolve: {
    //         
    extensions: ['.js', '.vue', '.json'],
    //       
    //    import Vue from 'vue'，     'vue/dist/vue.common.js'   
    alias: {
        '@': resolve('src'),
        '@config': resolve('config'),
        'vue$': 'vue/dist/vue.common.js'
    }
}

ここでresolve()関数は、ファイル内のカスタム関数です.

function resolve (dir) {
  return path.join(__dirname, '..', dir)
}

パスをカスタマイズすることもできます.

alias: {
        '@': resolve('src'),
        '@config': resolve('config'),
        'vue$': 'vue/dist/vue.common.js'，
        '@components':path.join(__dirname, '..', 'src/components')//    
    }

PS:中のパスは、ファイルを参照するパスアドレスではなく、現在のファイルに対するパスアドレスです.