Babel插件用于增强Sublime Text对ES6+、JSX和React的语法高亮与代码提示。通过Package Control安装后，需设置默认语法为JavaScript (Babel)，并将.js和.jsx文件关联，以实现自动高亮。插件原生支持JSX，可通过右下角语言模式手动切换或保存为.jsx文件启用。此外，支持clg等代码片段，并可自定义snippets提升开发效率。配置完成后，JavaScript和React项目编辑体验更流畅。
Sublime Text 中的 Babel 插件主要用于增强对现代 JavaScript（ES6+）、JSX 以及 React 项目的语法高亮和代码提示支持。默认情况下，Sublime Text 对 JavaScript 的语法支持有限，尤其在处理 .jsx 或使用 import/export、箭头函数等 ES6+ 特性时显示效果不佳。通过配置 Babel 插件可以解决这些问题。
安装 Babel 插件
推荐使用 Package Control 安装 Babel 插件，这是 Sublime Text 最常用的插件管理工具。
- 确保已安装 Package Control。如果没有，在 Sublime Text 中按下 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（Mac），输入 "Install Package Control" 并执行安装。
- 再次打开命令面板（Ctrl+Shift+P），输入 Install Package，选择 "Package Control: Install Package"。
- 等待插件列表加载完成后，搜索 Babel，点击安装。
安装完成后，.js 和 .jsx 文件将自动使用 Babel 提供的语法高亮方案。
设置默认语法为 Babel JavaScript
为了让所有 JavaScript 文件默认使用 Babel 高亮，需要手动设置文件关联。
立即学习“Java免费学习笔记（深入）”；
- 打开一个 .js 文件，点击右下角显示的语法模式（通常是 "JavaScript"）。
- 选择 Open Syntax Specific Settings。
- 在打开的配置文件中添加：
{
"extensions": ["js", "jsx"],
"syntax": "Babel/JavaScript (Babel)"
}
这样所有 .js 和 .jsx 文件都会默认使用 Babel 语法高亮。
启用 JSX 和 React 支持
Babel 插件原生支持 JSX 语法。对于 React 开发：
- 将文件扩展名保存为 .jsx，Sublime 会自动识别并应用 Babel 的 JSX 高亮规则。
- 若文件是 .js 但包含 JSX 代码，可在文件中手动切换语法：点击右下角语言模式 → 选择 Babel → JavaScript (Babel)。
自定义高亮与片段（Snippets）
Babel 插件还自带一些常用代码片段，如 clg + Tab 可生成 console.log()。
- 可在插件目录中查看或修改 snippets 文件（路径通常为 Packages/Babel/Snippets）。
- 也可创建自己的 snippet 来适配项目需求。
基本上就这些。配置完成后，你的 Sublime Text 就能很好地支持现代 JavaScript 和 React 语法了，代码更清晰，编辑体验也更流畅。
