Sublime Text 需通过 Babel 插件（v9+，作者 babel-sublime）支持 JSX/ES6+ 语法高亮，安装后须手动将 .jsx/.tsx 文件绑定为 JavaScript (Babel) 或 TypeScript (Babel) 语法，且 Babel 仅负责高亮，不提供校验、折叠增强或智能补全，需另配 ESLint、Emmet 等工具。
Sublime Text 本身不原生支持 React 的 JSX 语法和 ES6+ 新特性高亮/编译，必须通过插件补足。Babel 是最成熟、维护最久的方案，但安装方式和配置细节容易出错——尤其在 Sublime Text 4 环境下，旧教程里的 Package Control 搜索名、依赖项、语法绑定都已变化。
用 Package Control 安装 Babel 插件（ST4 兼容版）
别搜 “Babel” 或 “Babel Sublime”，这两个包早已停止维护或与 ST4 不兼容。正确做法是：
- 确保已安装
Package Control（没装就先按Ctrl+Shift+P→ 输入Install Package Control回车） - 打开命令面板：
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS） - 输入
Package Control: Install Package回车 - 在弹出列表中搜索并选择
Babel（作者是babel-sublime，GitHub 仓库名是babel/babel-sublime，图标为橙色 B） - 安装完成后重启 Sublime（非必需但推荐，避免语法高亮缓存问题）
手动设置 .jsx / .tsx 文件默认语法为 Babel
安装完插件后，.jsx 文件可能仍显示为 “Plain Text” 或 “JavaScript”，因为 Sublime 不会自动绑定扩展名。需手动指定：
- 打开一个
.jsx文件 - 点击右下角当前语法名称（如 “Plain Text”）→ 选择
Open all with current extension as…→Babel→JavaScript (Babel) - 或者更彻底：菜单栏
Preferences→Settings – Syntax Specific，在右侧 JSON 中添加："syntax": "Packages/Babel/JavaScript (Babel).sublime-syntax"
- 注意：如果同时用 TypeScript，
.tsx文件也要同样操作，选TypeScript (Babel)
常见错误：JSX 报红、无法折叠、自动补全失效
这些不是插件没装好，而是语法引擎和 Sublime 内置功能不协同导致的：
-
JSX tag is not closed类报错：Babel 插件只负责语法高亮和基础解析，不校验语法。你需要额外装SublimeLinter-eslint并配好项目级.eslintrc - 代码折叠失效：确认当前文件语法确实是
JavaScript (Babel)，且没有被其他插件（如JsPrettier）覆盖 syntax 设置 - 无 React 组件自动补全：Babel 插件不提供智能提示。需要配合
Emmet（开jsx模式）或AI Code Assist类插件，纯 Babel 不含 LSP 支持 - ST4 用户特别注意：老版本
Babel（v8.x 之前）不支持.sublime-syntax格式，必须用最新版（v9+），否则语法高亮会完全失效
真正卡住人的往往不是“装不上”，而是装完后文件没绑定对语法、或误以为 Babel 能替代 ESLint/LSP。React 开发流里，Babel 插件只管“看得清”，其余得靠别的工具补位。
