Sublime Text安装Babel-Sublime开发套件支持现代化JSX高亮-sublime-PHP中文网

必须装作者为babel-sublime的babel插件、路径与browse packages中文件夹名严格一致（大小写敏感）、并手动将.jsx文件绑定为babel → javascript (babel)语法，三者缺一不可，否则jsx标签、{}插值等均不高亮。

sublime text安装babel-sublime开发套件支持现代化jsx高亮

装对 Babel 插件、路径写准、语法手动绑定，三者缺一不可，否则 .jsx 文件永远是白底黑字或标红——Sublime 默认根本不解析 JSX。

装错包或路径大小写不一致，JavaScript (Babel).sublime-syntax 就加载失败，高亮直接归零。

用 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（macOS）打开命令面板 → 输入 Package Control: Install Package → 搜索 Babel → 只选作者栏显示 babel-sublime 的那个（GitHub 仓库名必须是 babel/babel-sublime）
装完后，菜单 → Preferences → Browse Packages… → 进插件目录，看文件夹名到底是 Babel 还是 babel-sublime（大小写敏感）
如果文件夹叫 Babel，后续所有配置里都得写 Packages/Babel/JavaScript (Babel).sublime-syntax；如果叫 babel-sublime，就得是 Packages/babel-sublime/JavaScript (Babel).sublime-syntax

根本原因：Sublime 默认不认 .jsx 后缀，Babel 插件不会自动接管扩展名，必须显式绑定语法。

Json Schema Toolkit

使用 JSON Schema 验证 JSON 数据，从示例 JSON 生成 schema，并将其转换为 TypeScript 接口、Python 数据类或 Markdown 文档。

下载

新建一个空文件，保存为 App.jsx，右下角点击当前语法名（比如显示 Plain Text）→ Open all with current extension as… → 选 Babel → JavaScript (Babel)
更可靠的一劳永逸方式：打开任意 .jsx 文件 → Preferences → Settings – Syntax Specific → 在右侧 JSON 中加一行："syntax": "Packages/Babel/JavaScript (Babel).sublime-syntax"（注意路径与 Browse Packages 中实际文件夹名严格一致）
千万别在 Settings – Syntax Specific 里加 "extensions" 字段——那是全局默认设置，会把 .js 文件也拖下水，导致普通脚本高亮错乱

Emmet 默认只响应 source.js 和 text.html.basic 作用域，而 JSX 文件设成 JavaScript (Babel) 后，作用域是 source.jsx，完全不匹配。

菜单栏 → Preferences → Package Settings → Emmet → Settings – User
在用户设置 JSON 中添加："syntax_scopes": {"javascript": ["source.js", "source.jsx", "source.js.jsx"]}
改完后，div + Tab 才能在 JSX 文件里正确展开成 <div></div>，而不是原地不动或生成 HTML 标签

这是两个独立问题：前者是语法高亮失效，后者是校验器（SublimeLinter-eslint）在报错，不是 Babel 的事。

{user.name} 白/灰 → 检查是否误入 Plain Text 模式：新建未保存文件、扩展名不是 .jsx 或 .js、右下角语法没切对都会导致
Unexpected token 报错 → 大概率是 SublimeLinter-eslint 在运行，但它默认用的是旧版 babel-eslint 解析器，不认识 JSX。删掉项目根目录 .eslintrc.js 里的 parser: "babel-eslint"，换成 parser: "@babel/eslint-parser"（截至 2026 年 7 月，babel-eslint 已废弃）