webstorm不认webpack的resolve.alias，因其仅依赖tsconfig.json的baseurl和paths进行静态分析，不执行动态路径解析；必须配置"baseurl":"."、"@/":["src/"]，并启用ts路径映射及重启服务。
WebStorm 本身不读取 webpack.config.js 的 resolve.alias，所以配了 Webpack 别名，Ctrl+Click 依然跳转失败——这是设计如此，不是你配错了。
为什么 WebStorm 不认 webpack 的 alias？
Webpack 的 resolve.alias 是运行时行为，由 Node.js 执行时动态解析；WebStorm 的跳转、补全、标红依赖 TypeScript 或 JavaScript 语言服务的静态分析。它只认 tsconfig.json（或 jsconfig.json）里的 compilerOptions.baseUrl 和 compilerOptions.paths，不执行 path.resolve()，也不读 vue.config.js 或 vite.config.ts。
常见错误现象：
-
import utils from '@/utils'标红，但项目能正常编译运行 - Ctrl+Click 跳转到
node_modules里同名包，而不是你的src/utils - 输入
@/后无路径补全提示
必须配 tsconfig.json 的 baseUrl 和 paths
WebStorm 只有在识别到合法的 TypeScript 路径映射后，才会启用别名跳转。关键点非常具体：
-
baseUrl必须写成"."（仅此一种写法），不能是"./src"、"src"或绝对路径——TypeScript 规范要求它作为所有paths的基准目录，而基准就是tsconfig.json所在位置 -
paths的 key 必须以/结尾，例如"@/*"✅，"@"❌（否则通配不生效） -
paths的 value 是相对于baseUrl的路径，所以"@/*": ["src/*"]表示从项目根目录下的src/开始找 - 确保
src/目录真实存在，且大小写完全一致（macOS/Linux 区分大小写）
示例 tsconfig.json 片段：
{"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["src/*"],
"@assets/*": ["src/assets/*"],
"@utils/*": ["src/utils/*"]
}
}}
WebStorm 设置里要手动启用并重启 TS 服务
即使 tsconfig.json 写对了，WebStorm 默认也不会加载 paths 映射，必须显式开启：
- 打开
Settings → Languages & Frameworks → TypeScript - 确认
TypeScript version指向项目本地的node_modules/typescript，不是 WebStorm 内置版本 - 勾选
Use paths mapping from tsconfig.json（新版默认开启，但重装或旧项目常被关掉） - 点击
Apply，然后右下角找到TS图标 →Restart TypeScript Service
没重启，改了配置也无效。重启后，标红会消失，Ctrl+Click 才真正生效。
Vue CLI / Vite 项目额外注意：别配错 config 文件位置
Vue CLI 3+ 和 Vite 默认不暴露 webpack.config.js，它们的 alias 在 vue.config.js 或 vite.config.ts 中定义，但 WebStorm 不读这些文件。此时有两种务实做法：
- 坚持用
tsconfig.json配paths（推荐）：和构建工具保持一致即可，比如 Webpack 用@指向src，你就配"@/*": ["src/*"] - 如果非要让 WebStorm 读 Webpack 配置（不推荐，维护成本高）：手动创建一个
webpack.config.js文件，内容只含resolve.alias，然后在Settings → Languages & Frameworks → JavaScript → Webpack里指定该文件路径——但要注意，这个文件纯属“骗 WebStorm”，对构建无任何作用
复杂点在于：tsconfig.json 如果不在项目根目录（比如用了 tsconfig.app.json），TypeScript 会优先用它，此时 paths 必须写进那个文件，而不是根目录的 tsconfig.json。
