Sublime中HTML的script/style块不自动高亮JS/CSS，因默认HTML语法未嵌入对应子语法；需手动修改HTML.sublime-syntax文件，在script/style上下文中添加embed: scope:source.js或source.css等规则，并确保缩进正确、scope名匹配。

Sublime 里 HTML 中的 script 和 style 块为啥不自动高亮 JS/CSS？

因为 Sublime 默认的 HTML 语法定义只把 script 和 style 当作普通标签处理，内部代码仍按 HTML 规则着色——不是 bug，是设计如此。它不会主动切换语法上下文。

• 真实表现：你在 <script> 里写 const a = () => {}，函数名、箭头可能没颜色，甚至括号匹配都失效
• 根本原因：Sublime 的语法系统基于「嵌入式语法（embed）」机制，而默认 HTML 语法文件（HTML.sublime-syntax）对 script 的嵌入规则缺失或被禁用
• 验证方法：右下角看当前语法名称，如果写的是 HTML 而不是 JavaScript (HTML) 或类似，就说明没触发嵌入

怎么让 script 块真正用 JS 高亮？

得手动补全 HTML 语法的嵌入规则，指向正确的 JS 语法定义。不是装插件，也不是改设置，是改语法文件本身。

• 路径定位：打开 Packages/HTML/HTML.sublime-syntax（用 Preferences → Browse Packages… 进入）
• 找到 contexts: 下的 script 规则段（通常在 tags: 之后），确认它是否包含类似 embed: scope:source.js 的行；若没有，就在 script 对应的 push: 块里加一行：- embed: scope:source.js
• 注意缩进：YAML 对缩进敏感，embed: 必须和 meta_scope: 同级，且比 script: 多两个空格
• 重启 Sublime 或用 Ctrl+Shift+P → Reload Syntax 刷新，再打开含 <script> 的 HTML 文件测试

style 块和 Vue/JSX 等怎么处理？

原理一样，但目标语法 scope 不同。Vue 单文件组件（.vue）默认不支持嵌入高亮，JSX 在 HTML 里更是完全无响应。

• style 块：在 HTML 语法中对应 style context，补 - embed: scope:source.css（或 source.scss 等）
• Vue 文件：需安装官方 VimL 维护的 Vue Syntax Highlight 包，它重写了整个 .vue 语法，内建 <script>/<style> 嵌入逻辑
• JSX：HTML 语法本身不识别 jsx scope，强行加 embed: scope:source.jsx 会报错——必须先确保已安装支持 JSX 的语法包（如 Babel），再修改其 HTML 衍生语法
• 兼容性提醒：某些语法包（如 JavaScript Next）scope 名为 source.js.embedded.html，嵌入时必须严格匹配，否则失效

为什么改了语法文件，部分文件还是不生效？

常见于文件已缓存语法状态，或被其他插件/语法包覆盖优先级。

• 检查右下角语法名：如果不是你预期的（比如显示 Plain Text 或 PHP），说明文件被别的规则劫持了
• 排查插件干扰：临时禁用 ApplySyntax、AutoSetSyntax 类插件，再试
• 文件关联优先级：Sublime 按 file_extensions → first_line_match → name 顺序匹配语法，.html 文件若开头有 #!/usr/bin/env node 可能被识别成 Shell
• 最稳妥方式：用 Ctrl+Shift+P → Set Syntax: HTML 手动指定，再观察嵌入是否触发

嵌入式高亮本质是语法 scope 的嵌套传递，不是“多语言并存”，而是“主语法在特定区域委托给子语法”。漏掉 scope 名拼写、缩进错误、或子语法未加载，任何一个环节断掉，高亮就卡在表层。