Babel

前端开发者、库作者和框架维护者用它把ES2015+代码转成浏览器能跑的兼容版本，Babel 8.0.0已发布。

它能做什么

Babel是一个JavaScript编译器，核心功能是将下一代JS语法（如ES2015+）转换为当前浏览器可执行的代码，同时通过polyfill填充缺失的API。

• 语法转换：把箭头函数、解构赋值、async/await等新语法转成ES5等效写法
• polyfill注入：配合@babel/preset-env和corejs，按目标浏览器自动按需填充Promise、Array.from等全局对象
• 插件化架构：所有转换以插件形式存在，用户可组合预设（preset）和单个插件定制编译规则
• CLI批量处理：通过@babel/cli命令将src目录所有文件编译输出到lib目录，支持--out-dir等选项

怎么上手

官方推荐通过npm安装@babel/core、@babel/cli和@babel/preset-env，并在项目根目录创建babel.config.json配置文件。

• 安装命令：npm install --save-dev @babel/core @babel/cli @babel/preset-env
• 配置文件示例：在babel.config.json中设置targets（如edge 17、firefox 60）、useBuiltIns: 'usage'、corejs: '3.6.5'
• 编译命令：./node_modules/.bin/babel src --out-dir lib，也可用npx babel简化路径
• 框架集成：若使用React、Vue等框架，配置可能已由脚手架自动处理，可参考交互式设置指南

核心工具包

Babel 7+采用模块化设计，所有包以@babel/为前缀，针对不同场景提供独立工具。

• @babel/core：核心编译引擎，提供transformSync等JavaScript API供程序直接调用
• @babel/cli：终端命令行工具，将Babel集成到开发流程中
• @babel/preset-env：智能预设，根据目标浏览器列表自动确定需要的语法转换和polyfill
• @babel/polyfill（已废弃）：v7.4.0后推荐直接使用core-js和regenerator-runtime，通过preset-env的useBuiltIns控制

社区与支持

Babel由志愿者团队维护，资金来自社区赞助，官方提供视频教程、用户展示和博客更新。

• 赞助等级：Base支持月均>2000美元，Gold 1000-2000美元，Silver 500-1000美元
• 交流渠道：Stack Overflow、Slack频道、X（Twitter）、Bluesky
• 学习资源：官网提供Getting Started指南、ES2015教程、人物与概念视频
• 版本升级：官方有专门页面指导从Babel 6.x升级到7.x，以及7.x到8.x的迁移

常见问题

Q1：Babel的@babel/preset-env如何确定需要转换哪些语法？

A1：preset-env根据你在配置中指定的targets（如浏览器版本列表）自动查询兼容性数据，只转换目标环境不支持的语法，并配合useBuiltIns选项按需注入polyfill。

Q2：Babel 8.0.0相比7.x有什么主要变化？

A2：Babel 8.0.0已正式发布，具体变更细节需查阅官方博客文章。已知v8移除了对Node.js 10以下版本的支持，并清理了大量废弃API。

更多同类工具与网站,可在预编译工具分类继续挑选。

信息核实于 2026年7月,具体以官网为准。