版权声明：本文为博主原创文章，转载和引用请说明出处。 https://blog.csdn.net/a1093439315/article/details/88756291
使用WebStorm支持vue-cli 3.0的Alias
在之前的vue-cli版本中，我们使用webpack.config.js来配置alisa，例如把src的别名设置为@，使用webstorm ctrl+b快捷键可以直接引导到对应的文件，但是vue-cli 3.0的配置使用的是新的方法来配置别名导致webstorm不能识别，我查了一下发现大家都是用添加一个新的老式alisa配置文件来解决的，在这里我介绍下新的方式解决这个问题：
其实在vue-cli 3.0的文档中有说明，我们打开webstorm->setting->直接引用此目录就可以了：
<projectRoot>/node_modules/@vue/cli-service/webpack.config.js
这里projectRoot表示你项目的根目录，完事记得使用npm编译一下代码并重新打开webstorm哦，否则是不会出现效果的！
例如我的alisa在vue.config.js文件中的配置是这样:
module.exports = {
chainWebpack: (config) => {
config.resolve.alias
.set('@', resolve('src'))
.set('assets', resolve('src/assets'))
.set('_v', resolve('src/views'))
.set('_c', resolve('src/components'));
}
};
使用的时候这样就可以了：
import routes from '@/config/routes';
vue-cli官方文档参见：https://cli.vuejs.org/zh/guide/webpack.html#审查项目的-webpack-配置