Volar是Vue 3项目中实现模板组件跳转的必备语言服务器，需卸载Vetur、安装Volar及TypeScript Vue Plugin、正确设置语言模式为Vue，并配置jsconfig.json/tsconfig.json的paths路径映射，否则跳转将失效。
Vue 项目在 VSCode 里按 Ctrl（Windows/Linux）或 Cmd（macOS）点击组件名却跳不到定义？不是插件没装，而是语言服务没接管或路径映射缺失——Volar 是当前唯一能稳定支撑 Vue 3 <script setup> + 类型推导 + 模板跳转的方案，Vetur 已过时且与之冲突。
为什么 Volar 是必须启用的语言服务器
Vetur 对 Vue 3 的 <script setup>、defineProps、defineEmits 等语法支持极弱，无法解析模板中 <UserCard> 到对应 defineComponent 或 export default 的语义链。Volar 则通过内建的 Template Interpolation Service 构建脚本与模板之间的双向索引。
- 必须卸载 Vetur（如有），否则两者同时激活会互相屏蔽语言功能
- 安装
Volar和TypeScript Vue Plugin (Volar)两个扩展，缺一不可 - 右键任意
.vue文件 → “Change Language Mode” → 明确选为Vue，不能是HTML或Vue HTML - 若仍跳转失败，检查状态栏右下角是否显示 “Volar” 而非 “Vetur” 或 “TypeScript”
jsconfig.json / tsconfig.json 路径别名不生效的典型表现
点击 <@/components/Modal> 报错 “No definition found”，本质是 VSCode 的 TS/JS 语言服务根本不知道 @/ 指向哪——它不读 vite.config.ts 里的 resolve.alias，只认 jsconfig.json 或 tsconfig.json 中的 compilerOptions.paths。
- Vue 2 项目：确保根目录有
jsconfig.json，含"include": ["src/**/*"]和"compilerOptions": {"allowJs": true} - Vue 3 + TypeScript：必须有
tsconfig.json，且"include"覆盖src/**/*和shims-vue.d.ts -
paths必须写成相对路径形式：{"@/*": ["src/*"]}，不能用./src/*或绝对路径 - 修改后需重启 VSCode 窗口（不是重载），否则缓存未刷新，跳转仍失败
Volar 的 vueMacros 开关影响 ref 解构和 defineProps 类型推导
开启 Vue > Experimental: Vue Macros 后，const { count } = toRefs(props) 或 const { name } = reactive({ name: '' }) 才能在模板中被正确识别为字符串类型，否则一律显示 any；同理，defineProps<{ visible: boolean }>() 的泛型才生效。
使用 `@ainative/vue-sdk` 为 Vue 3 应用添加 AI 聊天功能。适用于以下场景：(1) 安装 `@ainative/vue-sdk`，(2) 在 Vue 组件中使用 `useChat` 组合式函数，(3) 提供……
立即学习“前端免费学习笔记（深入）”；
- 该选项默认关闭，必须手动勾选（设置中搜
volar.vueMacros） - 开启后首次打开大型项目索引时间明显变长，但后续编辑体验提升显著
- 若项目用的是 Vue < 3.3，此选项无效，应降级使用
PropType显式标注 - 不重启 VSCode 窗口，该设置不会加载进语言服务进程
格式化器冲突导致 .vue 文件跳转异常
当 Prettier 被设为 .vue 文件默认格式化器时，它会把 <template> 当作纯 HTML 处理，破坏 Volar 所需的结构标记，进而导致跳转定位偏移甚至失效。
- 在设置中搜
prettier.vue，清空Prettier: Vue Files Suffixes字段（留空） - 确保
.vue文件右下角语言模式是Vue，且格式化器显示为Volar（不是 Prettier） - 如已配置 ESLint，建议将
"editor.codeActionsOnSave": {"source.fixAll.eslint": true}绑定到保存动作，比 Prettier 更懂 Vue 语法 - 禁用 Prettier 对
.vue的接管后，<style scoped>中的 CSS Modules 类型提示也会恢复
最常被忽略的一点：Volar 的模板跳转能力严重依赖 tsconfig.json 或 jsconfig.json 是否存在、是否被正确读取——哪怕你只写 JS，Vue 3 项目也强烈建议配一个最小化的 jsconfig.json，否则连最基本的 @/ 别名跳转都会静默失败。
