vue => 什么意思_Vue导入模块import xxx from '@/xxx'中的@是什么含义?

32fcb56d9cd8b14bb8e7d57ff25020fb.png

1、ES6 模块主要有两个功能:export 和 import

export:用户对外输出本模块(一个文件可以理解为一个模块,比如 aaa.js bbb.js)变量的接口 。

import:用于在一个模块中加载另一个含有 export 接口的模块(也就是这个 js 文件一定要含有 export )。

而我们在使用 import 导入一个模块的时候通常这样使用:

import util from '@/libs/util'

那么这个 @ 到底是个什么意思呢?

2、webpack.base.conf.js 文件有如下代码

cb9fdc09db5a2309b0e6382ebd15fa3e.gif
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' }}
cb9fdc09db5a2309b0e6382ebd15fa3e.gif

是不是已经很明确了呢? @ 等价于 src,举一反三,也支持自定义的。