Vetur已停止维护，Vue 3项目应迁移到Volar；Vue 2项目可安装Vetur实现基础支持，但需正确配置文件关联为vue语言模式并避免ts类型报错。

VSCode 安装 Vetur 插件本身很简单，但真正影响 Vue 开发体验的，是它和项目配置、Vue 版本、TypeScript 支持之间的配合。Vetur 在 Vue 3 + setup + TypeScript 项目中默认行为可能不生效，甚至报错 Cannot find name 'defineProps' 或 Property 'xxx' does not exist on type 'ComponentPublicInstance' —— 这不是插件没装好，而是配置没对上。

在 VSCode 扩展市场搜索并安装 Vetur

Vetur 已于 2025 年底停止维护，官方推荐迁移到 Volar（尤其 Vue 3 项目）。但如果你仍在维护 Vue 2 项目，或需快速启用基础语法高亮/模板补全，Vetur 仍可工作：

• 打开 VSCode，点击左侧扩展图标（或按 Ctrl+Shift+X）
• 搜索框输入 Vetur，认准发布者为 octref 的官方插件
• 点击「Install」，安装后**无需重启 VSCode**，但需确保当前打开的是一个含 .vue 文件的文件夹
• 装完后打开任意 .vue 文件，应看到 区域有 HTML 补全， 区域有 JavaScript 语法支持

Vetur 不生效？检查文件关联和语言模式

常见现象：打开 .vue 文件，右下角显示「Plain Text」或「HTML」，而不是「Vue」——这时 Vetur 完全不会启动。

• 点击 VSCode 右下角语言模式标识（如「Plain Text」），选择「Configure File Association for '.vue'」
• 在弹出的下拉菜单中选 vue（不是 html 或 javascript）
• 也可手动在用户设置中添加：

  "files.associations": {
    "*.vue": "vue"
  }

• 如果项目已存在 .vscode/settings.json，确认里面没有覆盖该配置，例如误写 "files.associations": {"*.vue": "html"}

Vue 3 项目强烈建议换用 Volar，而非强行用 Vetur

Vetur 对 Composition API（尤其是 defineProps、defineEmits）缺乏类型推导支持，且与 Vue 3 的响应式系统、TSX 支持存在根本性兼容问题。

• 卸载 Vetur：在扩展面板中找到它，点击「Uninstall」
• 安装 Volar（发布者 Vue）和 Volar Server（自动随 Volar 安装）
• 禁用 Vetur 的旧版语言服务器：在 VSCode 设置中搜 volar.enable，勾选 Volar: Enable，取消勾选 Vetur: Enable
• 若项目使用 defineProps<...>() 语法，还需在 tsconfig.json 中启用 "compilerOptions": { "types": ["vue"] }

额外注意：Vetur 的 vetur.validation.template 已被弃用

老教程常让你在 settings.json 里加：

"vetur.validation.template": true

真正容易被忽略的是：Vetur 的代码片段（如输入 v-for 回车生成完整结构）只在语言模式为 vue 且文件后缀为 .vue 时触发；如果用 .jsx 或 .tsx 写 Vue 组件，它完全不工作——这时候得靠 Volar 或纯 TypeScript 配置。