必须安装vue syntax highlight插件并手动绑定.vue后缀为vue component，同时配置vue_version为"3"、启用enable_ts_in_script等嵌入开关，三步缺一不可；装错插件名或跳过任一步均导致白底黑字或控制台报错。
装错插件名会导致白底黑字且控制台报错
Sublime 默认完全不识别 .vue 文件，打开就是纯文本——这不是配置漏了，是压根没语法定义。真正起作用的只有 Vue Syntax Highlight 这一个插件，名字必须严格匹配：首字母大写、中间空格、末尾带 s 和大写 H。
- 搜
vue syntax或vue highlight容易误装旧包，比如VueJS（已停更，ST4 加载失败，报ImportError: No module named 'sublime_plugin'） -
vue-component仅适配 ST2，ST3/ST4 下defineProps()和withDefaults()直接漏高亮 - 装完检查
Preferences → Browse Packages…下是否存在Vue Syntax Highlight/文件夹（不是vuejs/或vim-vue/） - 如果已装
VueJS，务必进Preferences → Package Settings把它禁用，否则语法冲突导致高亮降级
没手动绑定 .vue 后缀，永远显示 Plain Text
插件只提供语法文件 Packages/Vue Syntax Highlight/Vue.sublime-syntax，不会自动把 .vue 后缀绑定过去。跳过这步，重装十遍也还是白底黑字。
- 打开任意一个
.vue文件，点击右下角当前语法名（如Plain Text） - 选择
Open all with current extension as…→ 找到并点击Vue Component（注意不是Vue或HTML） - 如果菜单里没出现
Vue Component，按Ctrl+`查控制台是否有报错；常见原因是Package Control版本太旧，先升级再重试 - 绑定后该设置写入用户配置，重启 Sublime 也不失效，但换机器或重装需重设一次
<script setup lang="ts"> 还是灰色？嵌入规则没开或子语言缺失</script>
Vue Syntax Highlight 依赖 Sublime 的嵌入语法机制来高亮区块内容。<script></script> 和 <style></style> 块内无颜色，90% 是嵌入规则没生效，不是插件本身问题。
vue-component-analyzer
下载
递归分析 Vue 项目组件依赖，从入口文件生成组件层级图，支持 Vue 2/3，输出组件名、文件路径和属性。适用于分析组件结构、排查依赖或了解项目架构。
- 进
Preferences → Package Settings → Vue Syntax Highlight → Settings，确认"vue_version": "3"已设为"3"（默认可能是"2"） - 在用户配置中加入嵌入开关：
"enable_vue_blocks": true、"enable_ts_in_script": true（不用enable_js_in_script）、"enable_css_in_style": true - 确保已单独安装对应子语言插件：TS 需
JavaScriptNext - ES6 Syntax或官方TypeScript插件；SCSS 需SCSS插件（作者 css415），且先开一个.scss文件确认右下角显示SCSS - 临时验证法：把
.vue文件后缀临时改成.js，看<script></script>区块是否恢复高亮——能恢复说明是 Vue 层解析失败，不是 Sublime 整体崩溃
别指望它做语义提示或自动运行项目
Vue Syntax Highlight 只负责着色，不提供类型推导、跳转或补全。Sublime 是纯文本编辑器，没有内置 Node.js、打包器或 HTTP 服务器，无法直接运行 Vue 项目。
- 所谓“运行 Vue 项目”，实际是终端执行
npm run dev，Sublime 仅用于编码 - 智能提示基本靠词典匹配（如变量名自动补全），不是真正的类型推导；
AutoFileName对import路径有用，Emmet对模板展开有用，但对v-if、@click等指令无扩展 - 别信
Vue Completion这类老插件：它们基于正则硬编码，Vue 3的defineProps、defineEmits完全不识别，还常报错干扰编辑
嵌入配置和子语言支持这两步最容易被跳过，但恰恰决定 <script setup lang="ts"></script> 和 <style scoped lang="scss"></style> 能不能真正着色——光装插件、绑后缀，只是让文件“被认出来”，还没让它“看得懂”。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
