jsconfig.json是必须的，因为vscode的typescript语言服务只识别其compileroptions.baseurl和paths配置，不读webpack或vite的别名设置；最小配置需设baseurl为"."并定义"@/": ["src/"]。
VSCode 默认不识别 @ 别名，不配 jsconfig.json 就没法 Ctrl+点击跳转到 @/components/xxx 对应的文件。
为什么 jsconfig.json 是必须的
Vue CLI 项目默认用 Webpack 解析 @（指向 src），但 VSCode 的 TypeScript 语言服务不读 Webpack 配置。它只认 jsconfig.json（JS 项目）或 tsconfig.json（TS 项目）里的 compilerOptions.baseUrl 和 compilerOptions.paths。没这个文件，路径补全、跳转、重命名统统失效。
-
jsconfig.json必须放在项目根目录（和package.json同级） - 即使你用的是纯 JS（非 TS），也得叫
jsconfig.json，不能叫tsconfig.json - 改完后需重启 VSCode 或执行
Developer: Restart TS Server命令
jsconfig.json 的最小可用配置
别抄网上的复杂模板，Vue CLI 默认结构下，只需声明 @/* 映射到 src/*：
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["src/*"]
}
},
"include": ["src/**/*"],
"exclude": ["node_modules"]
}
-
baseUrl: "."是关键，它让paths的相对路径以项目根为基准 -
"@/*": ["src/*"]表示所有以@/开头的导入，都去src/下找对应路径 -
include确保语言服务索引src下的文件；exclude避免扫描node_modules拖慢响应
常见跳转失败原因和排查点
配了还是跳不到？大概率是这几个地方卡住了：
Json Schema Toolkit
下载
使用 JSON Schema 验证 JSON 数据，从示例 JSON 生成 schema，并将其转换为 TypeScript 接口、Python 数据类或 Markdown 文档。
- 文件名大小写不一致：比如
import Xxx from '@/components/HelloWorld.vue'，但实际文件叫helloworld.vue—— Windows 可能不报错，macOS/Linux 直接跳转失败 -
jsconfig.json放错位置：比如在src/里，或被 IDE 自动创建在子文件夹中 - 路径用了双重别名：如
@/@/utils，paths不支持嵌套解析 - Vue 单文件组件
<script setup></script>中使用了动态 import：defineAsyncComponent(() => import('@/pages/Home.vue'))—— 这种写法 VSCode 当前版本（1.90+）仍无法跳转，属于已知限制
如果项目用了 Vite 怎么办
Vite 本身不依赖 jsconfig.json 实现别名，但它对 IDE 的支持依然靠这个文件。Vite 用户同样需要配 jsconfig.json，且内容和 Vue CLI 项目完全一致 —— 因为 VSCode 不关心你用什么构建工具，只认这个配置。
唯一区别是：Vite 的 vite.config.ts 里也得同步维护别名，否则运行时出错。例如：
resolve: {
alias: {
'@': path.resolve(__dirname, 'src')
}
}
但注意：这里只是保证运行时正确，不影响 VSCode 跳转逻辑。
别名跳转真正起作用的地方，永远只有 jsconfig.json 里的 paths —— 其他地方配得再全，VSCode 也看不见。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
