必须卸载Vetur并仅启用Volar，否则会导致跳转失效、ref无类型提示、defineComponent不识别等冲突问题。
Vue项目在VSCode里写得卡顿、跳转不到定义、ref没类型提示、defineComponent不识别——大概率不是你代码问题，而是插件组合或配置冲突了。
Volar vs Vetur：必须二选一，不能共存
Volar是Vue 3 + TypeScript项目的事实标准语言服务器，Vetur已停止维护（2023年10月起官方明确标注“deprecated”）。两者同时启用会导致：
-
vscode-vue-languageservice和vetur同时监听.vue文件，触发重复诊断、跳转失效、Ctrl+Click失灵 - Vetur的格式化会覆盖Prettier对
<script setup>的处理，导致defineProps参数丢失类型推导 - VSCode右下角语言模式可能显示“Vue (Vetur)”但实际使用的是Volar，造成行为不可预测
实操建议：
- 彻底卸载
Vetur，重启VSCode - 安装
Volar（含配套的Volar Server）和TypeScript Vue Plugin（二者需同时启用） - 确认设置中
"vue.preferences.useVolarForJs": true已开启，让.js文件里的Vue逻辑也受支持
自动导入组件失效？检查 vue.autoImport 配置项
Vue 3项目中写<MyButton></MyButton>却没自动补全或报“未定义”，常见原因是Volar的自动导入开关被关了，或路径别名没被正确识别。
立即学习“前端免费学习笔记（深入）”；
关键配置在 .vscode/settings.json 或工作区设置中：
{
"vue.autoImport": true,
"typescript.preferences.includePackageJsonAutoImports": "auto",
"volar.aliases": {
"@": "./src"
}
}
注意点：
分析 Vue 3 Composition API 使用情况——审计响应式模式、可组合函数设计、ref 与 reactive 的选择、计算属性、watcher 使用及组件……
-
volar.aliases是Volar专用配置，jsconfig.json或tsconfig.json中的paths不会被Volar直接读取 - 如果用了
vite-aliases插件或自定义解析器，需手动同步到volar.aliases -
autoImport对defineAsyncComponent或动态import()无效，只作用于静态组件标签
模板内表达式无类型提示？确认启用了 vue.experimental.templateCompilerOptions
在 <template> 里写 {{ user.name }} 却没有TS类型提示，甚至 user 根本没补全——这不是插件没装，而是Volar没拿到足够的编译上下文。
解决方法是在项目根目录的 jsconfig.json 或 tsconfig.json 中显式声明模板编译选项：
{
"compilerOptions": {
"types": ["vue"],
"vueCompilerOptions": {
"target": 3,
"experimentalCompatMode": 0
}
}
}
特别注意：
-
vueCompilerOptions必须写在compilerOptions下，不能平级；否则Volar完全忽略 - 若用Vite，还需确保
vite.config.ts中vue()插件未禁用template编译（默认开启） - 修改后需重启Volar Server（Cmd/Ctrl+Shift+P → “Volar: Restart Server”）
Snippets补全不触发？优先检查触发范围和前缀大小写
vue 片段（如 vue3、setup）输完回车没反应，往往不是插件没装，而是VSCode没识别当前语言模式或前缀不匹配。
常见原因和对策：
- 文件未被识别为Vue：确认文件后缀是
.vue，且右下角状态栏显示“Vue”而非“HTML”或“Plain Text” - 片段前缀大小写错误：
setup有效，Setup或SETUP无效（Vue VSCode Snippets 默认全部小写） - 多个Snippets插件冲突：禁用
Vue 3 Snippets和Vue VSCode Snippets中的一个，后者更新更勤、覆盖更全 - 想在
<script setup>里用ref快捷输入？要装JavaScript (ES6) code snippets，它提供ref、computed等通用JS片段
真正容易被忽略的是：Volar接管了大部分语言功能后，Snippets插件的优先级会下降。如果补全列表里始终看不到vue片段，试试在设置中把 editor.suggest.showSnippets 设为 true，并确保 editor.quickSuggestions 对 other 和 strings 都开启。
