vue.json代码片段不生效，根本原因是语言模式、scope或json结构错误；需确保右下角显示“vue”（非vue html/vue volar），scope字段严格为"vue"，且文件置于用户snippets目录并重启.vue文件。
vue.json 代码片段不生效，基本就是语言模式、scope 或 JSON 结构三者之一错了——不是插件没装全，也不是 VSCode 坏了。
为什么输入 vue 按 Tab 没反应
VSCode 不看文件后缀，只认右下角显示的语言模式。哪怕你打开的是 Button.vue，如果状态栏写着 HTML 或 Plain Text，vue.json 里的所有 prefix 都不会触发。
- 点击右下角语言标识，手动选成
Vue（注意：不是Vue HTML，也不是Vue (Volar)） - 检查
settings.json里有没有错误的"files.associations"，比如"*.vue": "html"这种硬覆盖 -
vue.json必须放在用户 snippets 目录下（%APPDATA%\Code\User\snippets\或~/Library/Application Support/Code/User/snippets/），放项目里或.vscode/snippets/下默认不加载 - 改完
vue.json后，关掉当前 .vue 文件再重开——缓存不刷新，改了也白改
vue.json 中 scope 和 prefix 怎么配才对
scope 是唯一决定“能不能触发”的字段，必须写 "scope": "vue"，不能是 "html"、"javascript" 或留空。VSCode 只有在语言模式为 Vue 时，才会去匹配这个 scope。
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
-
prefix建议避开通用词，比如用vue3或sfc，而不是直接叫vue——Volar、Vue Snippets 插件很可能也声明了同名 prefix，会互相覆盖 - 多个插件同时提供
vfor，VSCode 只展示一个，不会合并；想保留原功能又加自定义逻辑，就换新 prefix，比如vfor-async - body 里写 TypeScript 泛型要转义：
"const $1 = ref($3);"，否则和 <code>>被当 HTML 标签解析，插入后语法直接报错
Vue 3 项目该用什么模板结构
别抄 Vue 2 的 Options API 模板。你项目用的是 <script setup lang="ts"></script>，片段里还写 export default { data() { } }，等于每次新建都得删三行再重写。
- 推荐 body 内容精简为：
"<template></template>", "<script setup lang="ts">", "import { ref, reactive } from 'vue'", "</script>", "<style scoped></style>" -
$0放在后面，光标停在样式块里，方便立刻写 CSS - 不要在
body数组里写注释行（如// setup），VSCode 不识别，会当普通文本插入 - 如果项目用 JS 而非 TS，把
lang='ts'改成lang='js'，不然 Volar 会跳类型错误
Volar 和代码片段的关系到底是什么
Volar 不提供模板，也不“激活”片段——它只是让 VSCode 正确识别 .vue 文件的语言模式为 Vue，从而让 scope: "vue" 生效。没有 Volar，.vue 文件大概率被识别成 HTML，片段自然失效。
- Volar 必须启用，且 Vetur 必须禁用；两者共存会导致
defineProps类型推导崩坏，ref()解构后变any - Volar 默认不开启宏支持，需手动打开设置
Vue > Experimental: Vue Macros，然后**完全关闭并重启 VSCode 窗口**（不是重载） - 路径别名（如
@/components/）跳转失败？90% 是tsconfig.json里没配baseUrl和paths，和插件无关
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
