安装Emmet和Babel插件；2. 在Emmet用户设置中添加syntax_map将javascript或babel映射为jsx，并启用jsx.selfClosingTags；3. 在.jsx或.js文件中输入缩写按Tab即可展开为符合React规范的JSX代码。
要让 Sublime Text 中的 Emmet 支持 JSX 语法，需进行简单配置，使 Emmet 在 React 的 JSX 文件中正常展开缩写。以下是具体操作步骤。
1. 安装必要插件
确保已安装以下两个核心插件：
- Emmet：提供 HTML/CSS 快速编码支持。
- JSX 或 Babel：为 Sublime 提供 JSX 语法高亮和识别。
推荐使用 Package Control 安装：
按 Ctrl+Shift+P 打开命令面板 → 输入 "Install Package" → 搜索并安装 Emmet 和 Babel（或 JSX）。2. 配置 Emmet 支持 JSX 语法
Emmet 默认不支持 JSX 语法作用于 .js 或 .jsx 文件，需手动添加语法映射。
打开 Emmet 配置文件：
- 菜单栏选择 Preferences → Package Settings → Emmet → Settings – User。
- 在打开的配置文件中添加如下内容：
{
"syntax_map": {
"javascript": "jsx"
},
"preferences": {
"jsx.selfClosingTags": true
}
}说明：
-
syntax_map表示将 JavaScript 语法文件（如 .js、.jsx）映射为 Emmet 的 JSX 模式。 -
jsx.selfClosingTags确保标签自动闭合（如
3. 在 JSX 文件中使用 Emmet
完成配置后，在 .js 或 .jsx 文件中：
- 输入 Emmet 缩写，例如：
div.container>ul>li*3。 - 按下 Tab 或 Ctrl+E 即可展开为 JSX 结构。
- 生成的标签会自动使用小驼峰命名和自闭合语法，适配 React 要求。
4. 可选：绑定到特定语法（如 Babel）
若使用 Babel 插件作为 JSX 语法高亮，需将语法名改为 babel：
确保当前文件使用的语法是 Babel（右下角显示），Emmet 才会生效。
基本上就这些。配置一次后，即可在 React 项目中流畅使用 Emmet 缩写，大幅提升 JSX 编写效率。
