vue 3 开发必须用 volar 而非已停更的 vetur,它完整支持 setup、defineprops 等语法和类型推导;需禁用 vetur、启用 sourcemap、遇跳转失效时重启 volar 服务;vuehelper 仅补全模板指令和 api 缩写,不参与类型检查;css peek 仅支持静态 class 跳转;bookmarks 命名书签可高效跨文件定位逻辑入口。

VSCode 做 Vue 开发,光靠基础语法高亮和 Emmet 远远不够——跳转不到 setup() 里的响应式变量、ref 和 computed 类型推导不准、defineProps 的参数无法被 ESLint 检查,这些问题不是 Vue 写得不对,而是插件没配对。
Vue 3 项目必须用 Volar,不是 Vetur
Vetur 已停止维护,对 defineProps、defineEmits、withDefaults 等组合式 API 支持极弱,类型提示常为空,跳转经常失效。Volar 是当前唯一能完整解析 .vue 单文件组件语义的语言服务器。
- 安装后需在 VSCode 设置中禁用 Vetur(如有),否则两者冲突导致诊断错误或补全消失
- 确保工作区启用
"vue.experimental.enableSourceMap": true(某些 TS 插件依赖此开关) - 若使用 TypeScript,Volar 会自动接管
.vue文件的类型检查,无需额外配置types字段 - 遇到跳转失效时,先执行
Volar: Restart Server命令,比重启编辑器更快
VueHelper 补全指令和选项,但别依赖它写逻辑
VueHelper 提供 v-if、v-for、key 等模板指令的快捷片段,也支持 onMounted、watch 等组合式 API 的缩写。但它不参与类型校验,也不影响编译行为。

