本文详细讲解如何利用 Babel 将 ES6 代码转换为兼容老版本浏览器的 ES5 代码。内容涵盖 Node.js 环境下的本地安装、.babelrc 配置文件规则设置（如 preset-env），以及使用 @babel/cli 进行命令行转码的具体命令和参数说明，帮助开发者在不支持 ES6 的环境中顺利运行现代 JavaScript 代码。
所需软件环境
Node.js 与 Babel
Babel 是一款主流的 ES6 转码工具，负责将 ES6 语法编写的代码转换为 ES5 标准，从而确保在旧版浏览器中能够正常执行。这使得开发者可以安心使用 ES6 的新特性，无需顾虑运行环境的支持情况。以下是一个简单的转换示例。
// 转码前
input.map(item => item + 1);
// 转码后
input.map(function (item) {
return item + 1;
});正式进入操作环节，首先需安装 Babel（在此之前请确认已正确安装 Node.js）
推荐在项目目录下局部安装 Babel，而非全局安装；请选择或创建项目目录，例如 E:/wwwroot/babel_test。
执行以下安装命令：
npm install --save-dev @babel/coreBabel 的配置文件名为 .babelrc，必须放置于项目根目录中。使用 Babel 的首要步骤是创建并配置该文件。该文件用于定义转码规则和插件，其基本结构如下所示。
{
"presets": [],
"plugins": []
}presets 字段用于指定转码规则，官方提供了多种规则集，用户可根据实际需求进行安装。
# 最新转码规则
$ npm install --save-dev @babel/preset-env
# react 转码规则
$ npm install --save-dev @babel/preset-react随后，将所需的规则添加到 .babelrc 文件中。
{
"presets": [
"@babel/env",
"@babel/preset-react"
],
"plugins": []
}请注意，后续所有 Babel 相关工具和模块的使用，都必须在预先写好 .babelrc 文件的前提下进行。
命令行转码操作
Babel 提供了命令行工具 @babel/cli，专门用于在命令行环境中执行代码转码任务。
其安装命令如下所示。
npm install --save-dev @babel/cli基本使用方法如下。
# 转码结果输出到标准输出
$ npx babel example.js
# 转码结果写入一个文件
# --out-file 或 -o 参数指定输出文件
npx babel example.js --out-file compiled.js
# 或者
npx babel example.js -o compiled.js
# 整个目录转码
# --out-dir 或 -d 参数指定输出目录
npx babel 源目录 --out-dir 转后目录
# 或者
npx babel 源目录 -d 转后目录
# -s 参数生成source map文件
npx babel 源目录 -d 转后目录 -s若觉得本地配置较为繁琐，也可通过在线转换工具 1 或在线转换工具 2 进行快速处理。
至此，关于 ES6 代码转 ES5 的教程（含 Babel 安装与使用）介绍完毕。如需了解更多 ES6 转 ES5 相关内容，请搜索本站往期文章或继续阅读后续相关文章，感谢大家的支持！