我们在开发的过程中，经常使用到‘@’代表‘src’，编辑器默认是无法识别到代表什么意思的，使用Ctrl+左键的方式无法找到对应文件。
方法一
- 在项目根目录新建.eslintrc.js文件，配置 settings
const path = require('path')
module.exports = {
settings: {
'import/resolver': {
alias: {
map: [
['~', path.resolve(__dirname, './src')],
['@', path.resolve(__dirname, './src')],
],
},
},
},
}
-
重启编辑器即可
image.png
方法二
- vue.config.js新增配置项
module.exports = {
configureWebpack: {
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
},
},
},
}
- 重启编辑器
方法三
针对webstorm配置
Settings -> language & frameworks -> javascript -> webpack
webpack configuration file 设置为 当前项目目录[路径]下的 node_modules/@vue/cli-service/webpack.config.js
例如：D:/development/workspace/vue/vote-system/node_modules/@vue/cli-service/webpack.config.js
