Bable是JavaScript的编译器
把浏览器不支持的ES6新特性，变成浏览器可执行的代码
使用：可在线使用，可本地安装
1、首先需要node.js环境
2、进入开发的项目目录，初始化 package.json：
npm init //后面根据需求填写，或一路回车即可 //或者直接使用默认的初始化 npm init -y
3、安装bable，同样需要在该目录下进行
//逐个项目安装（官网新版写法）
npm install --save-dev @babel/core @babel/cli
//逐个项目安装（旧版写法）
npm install --save-dev babel-cli
//简写是
npm i -D babel-cli
//若安装失败可能权限不够，可以
mac用户：sudo npm install ...
windows用户：用管理员打开cmd即可
4、在package.json文件下可以看到
"dependencise"下面的包 和 "devDependencise" 下面的包都是项目开发中用到的，上线的时候这些包都不需要的
5、在package.json中，"scripts" 下添加
"build":"babel entry.js -o index.js -w" //注意与上一句之间需要添加一个逗号
//-o index.js 表示将entry.js输出为一个新文件index.js
//-w 表示实时监听 entry.js ,当entry.js发生改变时，自动编译生成文件
6、在项目目录下创建 entry.js 文件
7、写完 entry.js 后，尝试运行。这步可以忽略
npm run build //实际上就是运行babel entry.js ，即刚才在scripts那里写的代码
//全局安装的时候才能直接使用 bable entry.js
1、安装 babel-preset-env
npm i -D babel-preset-env
2、在项目中创建 .babelrc 文件
3、在 .babelrc 中制定规则
//新版写法
{ "presets": ["@babel/preset-env"] }
//旧版写法
{
"presets":[
"env"
]
}
//还可以有更详细的制定计划：https://github.com/browserslist/browserslist
4、后直接使用，会自动监听，并生成文件了
npm run build
原文：https://www.cnblogs.com/mingliangge/p/12835595.html