Sublime需手动绑定.vue后缀到Vue Component语法并安装Vue Syntax Highlight插件，否则默认为纯文本；指令如v-if、@click需Vuejs Complete增强包支持，TS高亮需额外安装TypeScript插件。

Vue单文件组件后缀没高亮，.vue 文件全是白底黑字

Sublime 默认不识别 .vue 文件，打开就是纯文本。这不是插件冲突或配置错，是根本没告诉编辑器“这玩意儿该用什么语法解析”。

• 手动切换语法：右下角点击当前语法名（比如 Plain Text），选 Vue Component —— 但每次都要点，治标不治本
• 真正解决是绑定后缀：菜单栏 View → Syntax → Open all with current extension as… → Vue Component
• 如果列表里没有 Vue Component，说明还没装语法包（见下一条）

装了 Vue Syntax Highlight 插件，但 .vue 文件还是不生效

这个插件名字带“Syntax”，但它只提供语法定义，不自动绑定后缀，也不处理 <script setup> 或 <style scoped> 这类新写法的嵌套高亮。

• 确认安装方式：用 Package Control 装 Vue Syntax Highlight，别手抖装成 VueJS（那个是旧版，已停止维护）
• 装完必须重启 Sublime，否则新语法不会出现在 Open all with current extension as… 列表里
• <script lang="ts"> 里的 TypeScript 高亮需要额外装 TypeScript 插件，否则只当 JS 解析

template 里写 v-if、@click 没高亮，像普通 HTML 字符串

这是 Vue 语法包对指令和事件修饰符的默认支持较弱，不是你写错了，是高亮规则没覆盖到这些自定义属性。

vue-composition-api-best-practices

Vue 3 组合式 API 与 最佳实践，涵盖代码组织、useXxx 模式、组合式函数设计、Store 集成、响应式优化及功能抽取。

下载

• 原生 Vue Syntax Highlight 把 v- 开头的都当普通属性，不特殊着色；@ 和 : 前缀也常被忽略
• 可改用社区增强版：Vuejs Complete（注意名字带 Complete），它会对 v-if、@click.prevent 等做独立 token 匹配
• 但注意：它会把 <template> 整体当 Vue 模板处理，如果你混写了 JSX 或 HAML 片段，可能误判

保存后语法自动变回 Plain Text，或者新开 .vue 文件又失效

这是 Sublime 的“语法记忆”机制在作祟——它按文件路径模式匹配，而不是单纯看后缀。

立即学习“前端免费学习笔记（深入）”；

• 检查是否在项目根目录有 .sublime-project 文件，里面写了 "syntax": "Packages/Text/Plain text.tmLanguage" 这类强制覆盖项
• 有没有用到 ApplySyntax 插件？它会基于文件内容判断语法，遇到空 <script> 或只有注释的 .vue，可能误判为纯文本
• 最稳方案：删掉项目级配置，统一走 View → Syntax → Open all with current extension as… 绑定，靠后缀驱动

Vue 的语法高亮本质是多个语言层叠：HTML + JS/TS + CSS + Vue 特有指令。Sublime 不像 VS Code 那样有官方语言服务器，得靠社区语法包一层层补全。哪个环节漏了，对应部分就变灰——不是配错了，是少了一块拼图。