Sublime Text需安装ReactJS插件并设置语法为React JSX才能正确高亮JSX文件，Babel-sublime已停更不推荐；Emmet需确认语法作用域支持；但Sublime缺乏TS支持、智能跳转、实时Lint和调试集成，仅适合轻量编辑。
Sublime Text 本身不原生支持 JSX 语法高亮和 React 开发特性，但通过安装少量插件 + 简单配置即可达到可用水平；不过要注意：它无法替代 VS Code 或 WebStorm 的智能提示、TS 支持、调试集成等能力，适合轻量编辑或已有工作流不愿换编辑器的场景。
怎么让 Sublime 正确识别并高亮 JSX 文件
默认 Sublime 把 .jsx 文件当纯 JavaScript 处理，JSX 标签（如 <div>）会报语法错误或完全不着色。核心是切换语法定义：
<ul>
<li>打开任意 <code>.jsx 文件 → 点击右下角当前语法名（如 “JavaScript”）→ 选择 React JSX
ReactJS（Package Control 中搜这个名字，作者是 “nikhilm”），它提供 React JSX 语法定义Set Syntax: React JSX，或通过 Preferences → Settings – Syntax Specific 写入 "syntax": "Packages/ReactJS/ReactJS.sublime-syntax"
为什么 Babel-sublime 插件不推荐用了
Babel-sublime 曾是主流方案，但现在已停止维护（最后更新是 2018 年），在 Sublime Text 4 下会出现兼容问题：
- 高亮错乱，比如
{props.children}被截断着色 - 输入
后自动补全失效，或补出错误的 HTML 标签 - 与 Sublime 的新语法引擎（sublime-syntax）不兼容，容易触发
Unable to load syntax file错误 - 替代方案就是上面提到的
ReactJS插件，它基于现代语法定义，维护活跃，且体积小、无额外依赖
如何启用 Emmet 在 JSX 中的标签补全
Emmet 默认在 HTML 或 JSX 里都生效，但 Sublime 需确认作用域是否匹配：
- 确保已安装
Emmet插件（官方维护版，Package Control 搜 “Emmet” 即可） - 在 JSX 文件中，按
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS）→ 输入Set Syntax: React JSX，再试div.container+Tab - 如果没反应，检查
Preferences → Package Settings → Emmet → Settings，确认"syntax_scopes"包含"source.js.jsx"或"source.jsx"（不同插件写法略有差异） - 注意：Emmet 对
{}内的 JS 表达式不生效，只作用于 JSX 标签结构部分
Sublime 做 React 开发还缺什么，别硬扛
能高亮、能补全标签 ≠ 能高效开发 React：
- 没有类型检查：
PropTypes或 TypeScript 接口错误不会标红，靠肉眼或终端报错发现 - 没有组件跳转：点不到
import Button from './Button'的定义，Ctrl+Click失效 - 没有实时 lint：ESLint 规则（如
react-hooks/exhaustive-deps）需手动跑npx eslint才知道 - 调试只能靠
console.log或浏览器 DevTools，Sublime 无 source map 集成
如果项目已用 TypeScript + ESLint + Vite，Sublime 就只适合作为快速查看、改文案、调样式的小工具；真要写逻辑、查 bug，换编辑器省下的时间远超配置成本。
