请教各位，使用IDE对vue项目中webpack配置的alias目录进行定位

Question

在IDE中，例如webstrom，进行Vue项目的开发。在webpack配置了alias，将src目录设置为@。
但是在*.vue中import其他组件使用了@符号，编译器就无法直接获得路径，使用../这样才可以，能否有人可以
解决这个问题呢？

Answer 1

借助path即可

const path = require('path');

module.exports = function(options){
    var rootPath = options.rootPath;
    return {
        alias: {
            @: path.join(rootPath, "src")
        }
    }

}

Answer 2

{
  "compilerOptions": {
    "baseUrl": "./",  // all paths are relative to the baseUrl
    "paths": {
        "@/*" : ["src/*"]   
    }
  }
}

解决项目使用了webpack的alias路径引入情况下，vscode不支持代码跳转：
项目根目录新建 jsconfig.json，内容如上；
vscode就可以支持command|ctrl代码跳转了
参考链接：链接描述

Answer 3

方案一（推荐）：
根目录增加webStorm.config.js

System.config({
  'paths': {
    '@/*': './src/*'
 }
})

参考：https://stackoverflow.com/a/59369029

方案二：
webStorm配置：Settings > Languages & Frameworks > Javascript > Webpack
填入/你的项目目录/build/webpack.base.conf.js