webpack @import 使用路径别名问题？

Question

ctrl + 鼠标左键 提示文件不存在，但是编译没有问题。

Answer 1

当然 理解上简单区分一下
ctrl + 鼠标左键 是你编辑的功能(如果你希望能找到带别名的路径,去找找插件)
打包编译 是webpack进行的工作 会进行路径转换 通过别名去替换成真的路径
当然没问题

Answer 2

1、vscode安装插件Path Intellisense
2、配置插件

"path-intellisense.mappings": {
    "@": "${workspaceRoot}/src"
}

3、在项目package.json所在同级目录下创建文件jsconfig.json

{
    "compilerOptions": {
        "target": "ES6",
        "module": "commonjs",
        "allowSyntheticDefaultImports": true,
        "baseUrl": "./",
        "paths": {
          "@/*": ["src/*"]
        }
    },
    "exclude": [
        "node_modules"
    ]
}