必须装Volar、禁用Vetur、启用Take Over Mode并设.vue语言模式为vue；缺任一环会导致defineProps报红、ref不解包、template变量无高亮。
装 Volar，禁用 Vetur，启用 Take Over Mode，且确保 .vue 文件语言模式为 vue —— 缺任一环，defineProps 报红、ref 不解包、<template> 里变量无高亮，全都会发生。
为什么装了 Volar 还是灰乎乎？检查右下角语言模式是不是 vue
VSCode 不会自动把 .vue 文件交给 Volar 处理，哪怕插件已安装。常见现象：打开 App.vue，右下角显示 HTML、Vue (Vetur) 或 Plain Text，此时高亮必然断裂。
- 点击右下角语言标识 → 选 Configure File Association for '.vue' → 输入
vue回车（注意：不是Vue HTML，也不是Vue (Volar)） - 或在
.vscode/settings.json中硬写："files.associations": {"*.vue": "vue"} - 新开一个
test.vue验证：右下角必须显示干净的vue，且<template>标签有颜色、<script setup>里能F12跳转
defineProps 报 Cannot find name 'defineProps'？这不是代码错，是 Volar 没进 SFC 模式
这个错误几乎 100% 指向 Volar 未真正接管 .vue 文件的 TypeScript 服务。它还在当普通 TS 插件用，没识别到 setup 语境。
- 禁用 VSCode 内置的
TypeScript and JavaScript Language Features（命令面板搜built→ 找到它 → Disable (Workspace) → 重启窗口） - 项目根目录必须有
tsconfig.json（空文件也行），且不能在exclude字段里写"**/node_modules"或"node_modules"—— 否则@vue/language-core加载失败 -
<script setup lang="ts">里必须显式调用defineProps或defineEmits，哪怕空泛型：const props = defineProps<{}>()，这是触发 Volar 进入 Vue SFC 模式的“开关”
要不要开 Take Over Mode？不开就等于没装 Volar
默认状态下，Volar 只提供基础语法高亮和跳转；不开 Take Over，ref 不自动解包、template 里无类型提示、defineProps<T> 泛型推导全失效——所有核心能力都残废。
立即学习“前端免费学习笔记（深入）”；
- 按
Ctrl+Shift+P→ 输入Volar: Take Over Mode→ 回车 → 弹窗点 Yes - 必须等语言服务器重启完成，状态栏右下角显示
Volar (Take Over)（不是Vue，也不是Vue (Volar)） - 如果点了确认但没变化：先关闭设置里的
Volar > Enable Take Over Mode，再重新执行命令，最后彻底重启 VSCode 窗口（不是重载）
typescript.tsdk 指向哪里？指向错版本会导致 defineProps 宏不识别
Volar 的类型服务强依赖项目本地 TypeScript 版本。若 VSCode 用了内置旧版 TS（比如 4.9），而项目是 typescript@5.4+，defineProps<{ count: number }>() 就会直接报红。
- 在项目根目录
.vscode/settings.json中明确指定："typescript.tsdk": "./node_modules/typescript/lib" - 按
Cmd+Shift+P（macOS）或Ctrl+Shift+P（Win/Linux）→ 输入TypeScript: Select TypeScript Version→ 选 Use Workspace Version - 如果用 pnpm，运行
pnpm store path查路径，确认 VSCode 有权限读取（macOS 上偶尔因全盘访问被拦）
最易被跳过的其实是语言模式切换这一步：插件装了、设置写了、Take Over 也开了，但右下角没变成 vue，前面所有操作都白费。别信“应该生效了”，一定要亲手点一次、看一眼、新开文件验证一次。
