Sublime需安装Babel插件支持JSX高亮，因其持续同步Babel解析器规则，兼容ES2020+、TypeScript等；旧ReactJS/JSX插件已停更，导致高亮错乱、折叠异常；Babel仅解决语法渲染，补全跳转需配合Snippet或ESLint，强类型检查推荐VS Code。
Sublime 安装 Babel 插件支持 JSX 语法高亮
Sublime Text 默认不识别 .jsx 文件或 React 的 JSX 语法，直接打开会丢失标签高亮、属性着色和括号匹配。最稳定、维护活跃的方案是安装 Babel 插件——它不是“JSX 插件”，而是完整替代原生 JavaScript 语法定义，天然支持 JSX、ES2020+、TypeScript（需额外配置）等。
操作步骤：
- 用
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS）唤出命令面板 - 输入
Package Control: Install Package并回车 - 搜索
Babel，点击安装（注意作者是sublimetext-plugins，别选错成同名但无维护的旧包） - 安装完成后，打开任意
.jsx或.js文件，右下角点击语法类型 → 选择Babel → JavaScript (Babel)
之后可设为默认：右键文件标签 → Set Syntax: Babel → JavaScript (Babel)，或通过 Preferences → Settings – Syntax Specific 写入：
{"extensions": ["js", "jsx", "es", "es6"]}
为什么不用 ReactJS 或 JSX 插件？
老式 ReactJS 或独立 JSX 插件已多年未更新，对现代语法（如可选链 a?.b、空值合并 a ?? b、函数组件箭头体返回 JSX）支持断裂，容易导致高亮错乱、折叠异常甚至崩溃。而 Babel 插件持续同步 Babel 解析器规则，兼容性更可靠。
常见症状（用了过时插件后）：
-
className="..."中的双引号不配对高亮 - JSX 标签内嵌表达式
{count > 0 ? <div></div> : null}整块变白或红底报错 - 保存后自动删掉换行或缩进错位
让 Sublime 支持 React 自动补全和跳转
Babel 只解决语法渲染，不提供语义级功能。如需 useState 补全、组件名跳转、props 提示，需配合 SublimeCodeIntel 或轻量级替代 EasyClangComplete（对 JS 支持弱），但实际效果有限。更现实的做法是：
- 用
Tab触发内置 Snippet：输入rfc+Tab生成函数组件骨架，imrc+Tab引入 React 和 Component —— 这些来自ReactJS插件的 snippet 仍可用，只需不启用它的语法高亮 - 补全依赖 ESLint +
SublimeLinter：装好SublimeLinter和SublimeLinter-eslint，确保项目根目录有.eslintrc.js，错误和警告能实时显示 - 跳转靠文件名约定：Sublime 原生支持
Ctrl+P模糊搜文件，按ComponentName.jsx命名，比依赖符号索引更稳
不推荐强行配置 Flow / TypeScript 支持
有人试图用 FlowType 或 TypeScript-sublime-plugin 在 Sublime 里跑类型检查，结果往往是 CPU 占用飙升、响应延迟、类型提示不准。React 项目若真需强类型，VS Code 的 TS Server 集成度和稳定性远超 Sublime 所有插件组合。Sublime 的优势在轻快、低资源、快捷键流，别让它干 IDE 的活。
JSX 高亮只是起点，真正卡住开发效率的往往不是颜色，而是没有可靠的重命名、跨文件引用追踪和调试器——这些点上，Sublime 明确不补。
