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></script> 或 <style scoped></style> 这类新写法的嵌套高亮。
- 确认安装方式:用 Package Control 装
Vue Syntax Highlight,别手抖装成VueJS(那个是旧版,已停止维护) - 装完必须重启 Sublime,否则新语法不会出现在
Open all with current extension as…列表里 -
<script lang="ts"></script>里的 TypeScript 高亮需要额外装TypeScript插件,否则只当 JS 解析
template 里写 v-if、@click 没高亮,像普通 HTML 字符串
这是 Vue 语法包对指令和事件修饰符的默认支持较弱,不是你写错了,是高亮规则没覆盖到这些自定义属性。
ERMEB云盘发卡系统官方正版系统,发卡系统操作简单、方便、易懂。 系统微信小程序前端采用nuiapp后端采用think PHP6PC前端采用vue开发 使用场景:文件上传储存,适合个人/个体/中小企业使用。本系统配合微信小程序端进行使用,文件下载以及发卡商品卡密领取都需要进入小程序内获取下载码以及卡密领取,小程序内可设置积分充值以及任务获取积分,支持微信激励广告领取文件下载码以及卡密商品,可实现
- 原生
Vue Syntax Highlight把v-开头的都当普通属性,不特殊着色;@和:前缀也常被忽略 - 可改用社区增强版:
Vuejs Complete(注意名字带Complete),它会对v-if、@click.prevent等做独立 token 匹配 - 但注意:它会把
<template></template>整体当 Vue 模板处理,如果你混写了 JSX 或 HAML 片段,可能误判
保存后语法自动变回 Plain Text,或者新开 .vue 文件又失效
这是 Sublime 的“语法记忆”机制在作祟——它按文件路径模式匹配,而不是单纯看后缀。
立即学习“前端免费学习笔记(深入)”;
- 检查是否在项目根目录有
.sublime-project文件,里面写了"syntax": "Packages/Text/Plain text.tmLanguage"这类强制覆盖项 - 有没有用到
ApplySyntax插件?它会基于文件内容判断语法,遇到空<script></script>或只有注释的.vue,可能误判为纯文本 - 最稳方案:删掉项目级配置,统一走
View → Syntax → Open all with current extension as…绑定,靠后缀驱动









