必须装Vue Syntax Highlight插件、手动绑定.vue为Vue Component、配置vue_version为3并启用嵌套语法，三步缺一不可；否则.vue文件始终显示Plain Text。
要在Sublime Text中正确高亮.vue文件的、<script setup lang="ts">和<style scoped>三块内容，必须装对插件、绑对后缀、配对子语言引擎——漏掉任何一环，文件就永远是白底黑字。</script>
安装正确的Vue语法高亮插件
按Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS），输入Package Control: Install Package回车。
等待列表加载完成，【严格输入Vue Syntax Highlight】（首字母大写、中间空格、末尾带s和大写H），回车安装。
装完立刻进Preferences → Browse Packages…，确认目录下存在【Vue Syntax Highlight/】文件夹——不是VueJS/、不是vue-component/、也不是Vuejs/。如果看到后者，说明装错了，得先用Package Control: Remove Package卸干净。
若控制台（Ctrl+`）报ImportError: No module named 'sublime_plugin'，基本是旧插件残留导致的冲突，禁用或卸载VueJS等废弃包后再重试。
手动绑定.vue文件为Vue Component语法
打开任意一个.vue文件。
点击右下角当前语法名（例如显示“Plain Text”）。
选择Open all with current extension as… → 【Vue Component】（注意：不是“Vue”、不是“HTML”、也不是“Vue Template”）。
这一步不可跳过——插件只提供语法定义文件，从不自动注册后缀。跳过它，重装十遍仍是纯文本。
如果菜单里压根没出现“Vue Component”，说明插件根本没加载成功，不是绑定问题，要回上一步查控制台报错。
配置Vue Syntax Highlight的User Settings
第一步：进Preferences → Package Settings → Vue Syntax Highlight → Settings。
从零开始编排 SpringBoot+Vue 全栈项目工作流，适用于新建全栈项目或完整脚手架请求，触发后依次调用 product‑spec‑builder（需求调研）等模块。
第二步：在右侧User配置中，粘贴并确保以下三项存在：
"enable_ts_in_script": true,
"enable_vue_blocks": true,
"vue_version": "3"
【vue_version必须显式设为"3"】——默认值可能是"2"，会导致defineProps、v-model:value、#default插槽等完全不被识别，高亮直接断裂。
第三步：保存配置，重启Sublime Text（部分版本需重启才生效）。
验证<script setup>和TypeScript是否正常高亮</script>
方法一：临时把.vue文件后缀改成.ts，观察<script setup lang="ts">区块是否恢复高亮——能恢复，说明是Vue层解析失败，不是TS引擎问题。</script>
方法二：单独打开一个.ts文件，确认右下角显示的是JavaScriptNext - ES6 Syntax或TypeScriptSyntax——如果不是，说明底层语言支持缺失，需补装对应插件。
注意：<script setup>里的ref()、defineProps仍灰色？大概率是没装JavaScriptNext - ES6 Syntax或官方TypeScript插件，Vue Syntax Highlight本身不解析JS/TS，只负责把代码块“交出去”。</script>
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
