Sublime Text需三步协同实现.vue文件多语法高亮：安装Vue Syntax Highlight插件、手动绑定.vue后缀到Vue Component语法、配置vue_version及嵌入开关。缺一不可，否则部分区块呈灰色。
Sublime Text 默认不识别 .vue 文件，所谓“多语法混合高亮”（即 <template></template> 用 HTML、<script setup lang="ts"></script> 用 TypeScript、<style scoped lang="scss"></style> 用 SCSS）不是开箱即用的功能，必须靠插件+绑定+嵌入配置三者协同才能生效。只装插件或只改后缀，都会卡在某一块灰色不动。
必须装 Vue Syntax Highlight，别碰 VueJS 或 vue-component
Package Control 搜索时，**严格输入 Vue Syntax Highlight**（首字母大写、中间空格、末尾带 s 和大写 H）。其他名字基本都失效：
-
VueJS：ST2 旧包，Sublime Text 4 会报ImportError: No module named 'sublime_plugin' -
vue-component：已停更，defineProps()和withDefaults()不高亮 -
vue-syntax-highlight（全小写）：GitHub 手动安装的老版本，无 ST4 嵌入支持
装完检查 Preferences → Browse Packages… 下是否存在 Vue Syntax Highlight/ 文件夹；若存在 vuejs/，请先禁用它，否则语法冲突导致右下角不出现 Vue Component 选项。
手动绑定 .vue 后缀到 Vue Component 语法
插件只提供 Packages/Vue Syntax Highlight/Vue.sublime-syntax 文件，**不会自动注册文件关联**。跳过这步，.vue 文件永远显示 Plain Text。
立即学习“前端免费学习笔记（深入）”；
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
- 打开任意一个
.vue文件 - 点击右下角当前语法名（如
Plain Text） - 选择
Open all with current extension as… → Vue Component（注意不是Vue或HTML）
如果菜单里没出现 Vue Component，说明插件根本没加载成功——按 Ctrl+` 查控制台是否有报错；常见原因是 Package Control 版本太旧，需先升级。
配 vue_version 和子语言嵌入开关
Vue Syntax Highlight 本身不渲染 JS/TS/CSS，它靠 Sublime 的嵌入机制把区块交给对应语言插件处理。灰色 ≠ Vue 插件坏了，是子语言链断了。
- 确认已安装对应语言插件：
JavaScriptNext - ES6 Syntax或官方TypeScript插件（TS）、SCSS（作者css415）（SCSS） - 打开
Preferences → Package Settings → Vue Syntax Highlight → Settings – User，确保有：
{
"vue_version": "3",
"enable_vue_blocks": true,
"enable_ts_in_script": true,
"enable_css_in_style": true
}
不要修改 Vue.sublime-syntax 文件——它自带嵌入声明，改错会导致整个语法崩溃。
验证嵌入是否生效的临时方法
遇到某区块（比如 <script setup lang="ts"></script>）仍是灰色，可快速定位问题环节：
- 把
test.vue临时重命名为test.js，看<script></script>内容是否恢复高亮 → 能恢复，说明是 Vue 层解析失败，不是底层 JS/TS 插件问题 - 单独打开一个
test.scss文件，看右下角是否显示SCSS→ 不显示，说明 SCSS 插件未生效，<style lang="scss"></style>必然灰色
真正起作用的是“插件 + 绑定 + 嵌入配置”这个三角关系，缺一不可；任何一步松动，都会让某个区块掉出高亮链。很多人卡在第三步，却反复重装插件，其实问题不在那里。
