安装Babel插件可实现sublime Text对JSX语法高亮支持。首先通过控制台安装Package Control，重启后按Ctrl+Shift+P搜索并安装Babel插件，随后将.js或.jsx文件的语法设为JavaScript (Babel)，保存后即可看到JSX标签、属性等被正确高亮显示。

sublime text 默认不支持 JSX 语法高亮，但可以通过安装插件轻松实现 react/JSX 文件的语法高亮。以下是详细配置步骤。

1. 安装 Package Control（如果尚未安装）

Package Control 是 Sublime 的插件管理工具，绝大多数插件都通过它来安装。

• 打开 Sublime Text，按下 Ctrl+`（或菜单栏：View → Show console）打开控制台。
• 粘贴以下代码并回车：

import urllib.request,os; pf = ‘Package Control.sublime-package’; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.proxyHandler()) ); open(os.path.join(ipp, pf), ‘wb’).write(urllib.request.urlopen( ‘https://packagecontrol.io/’ + pf.replace(‘ ‘, ‘%20’)).read())

安装完成后重启 Sublime。

2. 安装 Babel 插件（推荐方案）

Babel 插件提供了完善的 React/JSX 语法高亮支持。

• 按下 Ctrl+Shift+P 打开命令面板。
• 输入 Install Package 并选择 “Package Control: Install Package”。
• 等待列表加载，然后搜索 Babel，点击安装。

安装完成后，Babel 会替代默认的 JavaScript 语法高亮，支持 .js 和 .jsx 文件的 JSX 高亮。

法语写作助手

法语助手旗下的AI智能写作平台，支持语法、拼写自动纠错，一键改写、润色你的法语作文。

31

查看详情

3. 设置默认语法为 Babel – JavaScript

为了让 .js 或 .jsx 文件自动使用 Babel 高亮：

• 打开一个 .jsx 文件（或任意 JS 文件）。
• 点击右下角显示的语法（如 “JavaScript”），选择 Babel → JavaScript (Babel)。
• 可选：设置默认关联，让所有 .js/.jsx 文件自动使用该语法。

你也可以手动设置文件关联：

• 打开一个 .jsx 文件 → 右下角语法 → Open all with current extension as… → Babel → JavaScript (Babel)。

4. 验证高亮效果

打开一个包含 JSX 代码的文件，例如：

const app = () => {   return <div className="hello">Hello, React!</div>; };

如果标签、属性、花括号等内容有不同颜色区分，说明高亮已生效。

基本上就这些。安装 Babel 插件是目前 Sublime 中支持 React/JSX 最稳定的方式，无需额外配置即可获得良好体验。