Sublime Text 默认不识别 .vue 文件，需安装 Vue Syntax Highlight 插件并重启才能实现 template/script/style 区块语法高亮及嵌套语言支持（如 TS），旧插件或冲突会导致高亮失效。
Vue 单文件组件（.vue）默认不被 Sublime 识别
Sublime Text 原生不支持 .vue 文件，打开后全是白底黑字，没有 、、 的语法区分。这是因为 Sublime 没有内置 Vue 语法定义，也不会自动按区块切换语法高亮模式。
- 手动设置语法：右下角点击「Plain Text」→ 选择「Open all with current extension as…」→ 搜索并选中「Vue Component」（需先安装对应插件）
- 若没看到「Vue Component」选项，说明插件未正确安装或未启用语法定义
- 注意：仅靠安装插件还不够，必须确保插件提供的
Vue Component.tmLanguage被 Sublime 加载（通常放在Packages/Vue Syntax Highlight/或Packages/vim-vue/下）
推荐插件：Vue Syntax Highlight（非 Vuejs Snippets）
别装错名字——Vuejs Snippets 只提供代码片段补全，不负责高亮；真正解决语法着色的是 Vue Syntax Highlight（作者：vuejs-sublime-project）。它用原生 Sublime 语法定义（.sublime-syntax 格式），比老式 tmLanguage 更稳定，支持嵌套语言（如 自动切到 TypeScript 高亮）。
- 安装方式：Package Control →
Install Package→ 搜Vue Syntax Highlight→ 回车 - 装完重启 Sublime（部分版本需重启才加载新语法）
- 验证是否生效：新建文件 → 输入
{{ }}、、msg有不同颜色Script 区块里的 ES6/TS 提示靠 JS 自身能力，不是 Vue 插件的事
Vue Syntax Highlight只管「怎么显示」，不管「怎么提示」。你在里写的data()、methods:等 Vue 特有结构，Sublime 不会自动补全——它没类型系统，也不解析 Vue 运行时逻辑。- 想获得基础 JS 补全（如
console.、Array.prototype.），确保已启用 Sublime 默认的JavaScript语法（通过Preferences → Settings – Syntax Specific查看） - 若用了
lang="ts"，需额外安装TypeScript Syntax插件，并确认其语法能被 Vue 插件正确嵌入（新版Vue Syntax Highlight支持，旧版vim-vue不支持） - 真正的「代码提示」（比如输入
this.弹出data属性）需要 LSP +Vue Language Features服务，Sublime 原生做不到；可搭配SublimeLSP插件 +volar（但配置复杂，远不如 VS Code 开箱即用）
常见踩坑：高亮错乱、script/style 区块失效
最典型现象是
里出现红色波浪线、中的:deep()不变色、或者整个文件只高亮了第一段。立即学习“前端免费学习笔记（深入）”；
- 检查是否启用了多个 Vue 插件冲突：禁用
vim-vue、VueJS、Vuejs Complete等旧插件，只留Vue Syntax Highlight - 确认文件编码为 UTF-8（无 BOM）：BOM 会导致 Sublime 解析
.sublime-syntax失败，表现为语法高亮完全不触发 - 如果
语法不识别，说明你用的是较老版本插件 —— 升级到Vue Syntax Highlight v2.0+（支持setup、defineProps、defineEmits关键字高亮）
// 示例：一个能被正确高亮的最小 .vue 文件
Vue 的语法高亮在 Sublime 上能做到「视觉准确」，但别指望它像 IDE 那样理解响应式依赖或提供语义级提示。真正卡住人的往往是插件冲突和旧版语法定义对新特性（如{{ msg }}setup、lang="ts"）的支持滞后。 - 想获得基础 JS 补全（如
