Sublime Text 需安装 Babel 插件实现 JSX 语法高亮，再安装 ES7+ React/Redux/React-Native snippets 提供组件、Hooks 等自动补全，若用 TypeScript 则额外安装 TypeScript 插件以支持类型提示与智能提示。
Sublime Text 默认不支持 JSX 语法高亮和 React 相关的自动补全，需要手动安装插件并配置。核心是两件事：让 Sublime 正确识别 .jsx 或 .js 文件中的 JSX 语法（高亮），以及提供组件、props、Hooks 等智能补全（需额外插件或设置）。
安装 Babel 插件（推荐：语法高亮 + 基础 JSX 支持）
Babel 是目前 Sublime 上对 JSX 支持最稳定、更新最及时的语法包，能正确高亮 JSX 标签、表达式、Fragment、新特性（如 、useEffect 等）。
- 打开 Command Palette（Ctrl+Shift+P / Cmd+Shift+P），输入 Install Package，回车后选择 Package Control: Install Package
- 搜索并安装 Babel（作者：dabbler0）
- 安装完成后，打开一个
.jsx文件 → 右下角点击当前语法（如 “JavaScript”）→ 选择 Babel → JavaScript (Babel) - 为永久生效：菜单栏 Preferences → Settings – Syntax Specific，在右侧配置中加入：
"syntax": "Packages/Babel/JavaScript (Babel).sublime-syntax"
关联 .js 文件也使用 JSX 高亮（可选但实用）
很多 React 项目仍用 .js 后缀写 JSX（尤其 CRA 默认）。需让 Sublime 对 .js 文件也启用 Babel 语法：
- 菜单栏 View → Syntax → Open all with current extension as… → Babel → JavaScript (Babel)
- 或更彻底：在 Preferences → Settings – Syntax Specific 中（确保当前是 JS 文件），添加：
"extensions": ["js", "jsx", "tsx"]（注意：这是语法文件自身的设置，不是全局设置）
添加自动补全支持（ES7+ React/Redux/React-Native snippets）
这个插件提供常用 React 代码片段，比如 imrc → import React + Component，ccf → class component with constructor & render，rfc → functional component 等。
- 通过 Package Control 安装插件：ES7+ React/Redux/React-Native/JS snippets（作者：dsznajder）
- 安装后无需额外配置，新建文件并设为 JavaScript (Babel) 语法即可触发补全
- 常用快捷键示例：
rfc+ Tab → 函数组件骨架clg+ Tab →console.log()imp+ Tab →import {} from ''usee+ Tab →useEffect(() => {}, [])
进阶：启用 TypeScript + JSX 补全（如用 .tsx）
若项目使用 TypeScript，建议再安装：TypeScript（官方插件，支持 TS 语言服务 + JSX 智能提示）
- 安装 TypeScript 插件（由 Microsoft 维护）
- 确保项目根目录有
tsconfig.json，插件会自动启用语言服务器 - 打开
.tsx文件 → 右下角选 TypeScriptReact 语法 → 即可获得 props 类型提示、组件跳转、错误检查等
基本上就这些。Babel 解决高亮，ES7 snippets 解决常用模板补全，TypeScript 插件覆盖类型场景 —— 三者搭配，Sublime 就能很顺手地写 React 了。
