Sublime Text 需手动配置才能支持 React 开发：正确安装 Babel 插件、严格匹配 Packages 路径大小写、将 .jsx 文件绑定 JavaScript (Babel) 语法、为 Emmet 添加 source.jsx 作用域，三者缺一不可。
Sublime Text 不能配置出真正的 React 开发环境，它只支持 JSX 语法高亮、Emmet 展开和片段补全——装错插件、路径写错、作用域没对，div就灰显、{count}就白底、className=""双引号就不配对，不是你代码有问题，是编辑器根本没加载 JSX 解析规则。
怎么确认 Babel 插件装对了且路径能用
装错包或路径写错，JavaScript (Babel).sublime-syntax就加载失败，高亮直接归零。
- 用
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS）打开命令面板，输入Package Control: Install Package，搜Babel，只认准作者是babel-sublime或 GitHub 仓库名babel/babel-sublime的那个 - 装完后，菜单 →
Preferences→Browse Packages…，进插件目录，看文件夹名到底是Babel还是babel-sublime（大小写敏感） - 如果文件夹叫
Babel，语法路径必须是Packages/Babel/JavaScript (Babel).sublime-syntax；如果叫babel-sublime，就得是Packages/babel-sublime/JavaScript (Babel).sublime-syntax - 路径错一个字母，
Syntax Specific配置就失效，右下角仍显示Plain Text或原生JavaScript
为什么 .jsx 文件还是白底黑字或标红
根本原因：Sublime 默认根本不认 .jsx 后缀，Babel 插件不会自动接管，必须显式绑定。
- 新建一个空文件，保存为
App.jsx，再点右下角语法名 →Open all with current extension as…→ 选Babel→JavaScript (Babel) - 更可靠的方式：打开任意
.jsx文件 →Preferences→Settings – Syntax Specific→ 在右侧 JSON 中加一行："syntax": "Packages/Babel/JavaScript (Babel).sublime-syntax"（注意路径与Browse Packages中实际文件夹名严格一致） - 别往这里加
"extensions"字段——那是全局默认设置，会把.js文件也拖下水，导致普通脚本高亮错乱
Emmet 在 JSX 里 Tab 不展开？改 syntax_scopes
Emmet 默认只响应 source.js 和 text.html.basic 作用域，而 JSX 文件语法设成 JavaScript (Babel) 后，作用域是 source.jsx，完全不匹配。
- 菜单栏 →
Preferences→Package Settings→Emmet→Settings – User - 在用户设置 JSON 中添加：
"syntax_scopes": {"javascript": ["source.js", "source.jsx", "source.js.jsx"]} - 保存后，用
Ctrl+Shift+P→ 输入Package Control: Rel（补全命令），重启 Emmet 或重启 Sublime
JSX 高亮依赖路径、作用域、语法绑定三者严丝合缝，缺一不可；source.jsx 作用域漏配、Packages 路径大小写错、Syntax Specific 里混进全局字段，都会让整个高亮链断裂。别怪插件，先查这三处。
