首先安装package control，再通过命令面板安装es6 react snippets插件，最后在javascript或jsx文件中使用clg、imr、rafce等缩写提升react开发效率。
要在Sublime Text中配置React代码片段并安装ES6 React Snippets，提升开发效率，可以按照以下步骤操作。整个过程包括安装Package Control、添加ES6 React Snippets插件以及使用自定义代码片段。
安装Package Control
Package Control是Sublime Text的插件管理工具，几乎所有的扩展都通过它来安装。
- 打开Sublime Text，按下 Ctrl+`（或菜单栏 → View → Show Console）打开控制台。
- 粘贴并运行官方提供的安装代码（可在 packagecontrol.io 获取最新版本）：
import urllib.request,os,hashlib; exec(urllib.request.urlopen('https://packagecontrol.io/installation').read().decode('utf-8'))
- 等待安装完成，重启Sublime Text后，会看到Preferences菜单下出现Package Control选项。
安装ES6 React Snippets插件
安装完成后，就可以通过Package Control来添加React代码片段支持。
- 按下 Ctrl+Shift+P 打开命令面板。
- 输入“Install Package”，选择“Package Control: Install Package”并回车。
- 等待插件列表加载，搜索“ES6 React Snippets”并点击安装。
安装成功后，你就可以在.js和.jsx文件中使用各种React快捷代码片段了。
常用ES6 React Snippets示例
以下是一些常用的缩写及其展开效果（在JSX文件中输入后按Tab键触发）：
- clg → console.log()
- imr → import React from 'react';
- ccp → 创建类组件（带props类型检查）
- rafce → 箭头函数组件（含export）
- useEffect → useEffect Hook模板
- useState → const [state, setState] = useState()
验证语法和文件类型
确保文件被正确识别为JavaScript或JSX，否则片段不会生效。
- 右下角查看当前语法模式，应为“JavaScript”或“Babel - JavaScript”。
- 如果不是，点击它，选择“Open all with current extension as…” → “JavaScript”。
- 建议配合Babel插件使用，以获得更好的JSX高亮支持。
基本上就这些。配置完成后，写React代码会快很多。关键是装对插件，并确认文件类型正确。不复杂但容易忽略细节。
