volar 必须接管 typescript 语言服务并切换 vue 语言模式，否则 defineprops 等无法识别、类型推导失效；需禁用 vscode 内置 ts 插件、手动设置 .vue 关联为 vue 模式、配置 .vscode/settings.json 并确保 tsconfig.json 正确。
Volar 必须接管 TypeScript 语言服务，否则 defineProps、ref 类型推导全失效，不是项目写错了，是编辑器根本没进 Vue SFC 模式。
禁用 VSCode 内置 TS 插件，让 Volar 接管
Volar 的类型能力（比如模板里变量自动提示、props 解构推导）依赖它自己的 TS 插件，和 VSCode 自带的 TypeScript and JavaScript Language Features 冲突。不关掉，就会出现“写了 defineProps 却仍报 Cannot find name 'defineProps'”这类典型症状。
实操建议：
- 按
Ctrl+Shift+P（Win/Linux）或Cmd+Shift+P（Mac），输入built→ 选Extensions: Show Built-in Extensions - 在插件列表搜索框里输入
@builtin typescript，找到TypeScript and JavaScript Language Features - 点击右侧齿轮图标 →
Disable (Workspace) - 执行
Developer: Reload Window或重启 VSCode
确认 Volar 已激活且为默认 Vue 语言服务
即使装了 Volar，VSCode 仍可能用 Vetur、HTML 或普通 TypeScript 模式打开 .vue 文件——此时右下角显示的是 HTML 或 Vue (Vetur)，而不是干净的 Vue。
实操建议：
- 打开任意
.vue文件，点击右下角语言模式标签（如显示HTML） - 选
Configure File Association for '.vue'→ 输入vue回车（**不要选Vue (Volar)或Vue HTML**） - 再点一次语言模式，手动切换成
Vue（这是 Volar 的专属语言模式） - 按
Ctrl+Shift+P运行Developer: Toggle Developer Tools，在 Console 里搜volar，确认有Registering Vue language features日志
项目级配置：.vscode/settings.json 关键项
全局设置会影响非 Vue 项目，必须用工作区配置精准控制。尤其当项目用 pnpm 或自定义 node_modules 路径时，Volar 可能找不到核心包。
实操建议：
- 在项目根目录建
.vscode/settings.json，写入：
{
"volar.enable": true,
"volar.enableStatusBar": true,
"volar.autoInsertDotValue": true,
"volar.ignoreProjectName": ["node_modules"],
"volar.serverPath": "./node_modules/volar-service-vue3"
}
说明：
-
volar.serverPath仅当pnpm项目或node_modules不在根目录时才需显式指定；否则删掉这行 - 确保项目有
tsconfig.json或jsconfig.json，且"include"包含"src/**/*.vue"，否则 Volar 看不到组件文件 - 如果用
pnpm且仍报@vue/language-core找不到，运行pnpm add -D @vue/language-core（即使不用它写代码）
script setup 中 defineProps 是开关，不是可选项
Volar 对 script setup 的类型支持是有条件的：它只在检测到 defineProps 或 defineEmits 时，才启用 Vue SFC 模式。漏写，ref 就不会自动解包，computed 提示 any，模板里变量无提示。
实操建议：
- 哪怕当前组件不需要 props，也写
const props = defineProps({})或const props = defineProps() - 避免在同一个
script setup里混用export default，一旦出现，Volar 直接退化为普通 TS 检查 - 检查
tsconfig.json中是否设置了"compilerOptions": { "vueCompilerOptions": { "target": 3 } }（Vue 3 项目必需）
最常被跳过的其实是语言模式切换和内置 TS 插件禁用——这两步不做，后面所有配置都白搭。Volar 不是装上就完事的插件，它需要明确的“交权”动作才能生效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
