使用Babel将ES6代码转为ES5代码，从而在现有环境执行。

前言

在线转码 https://babeljs.io/repl/#
https://es6console.com/

1.快速入门

&＃xff08;1&＃xff09;ES6的某些高级语法在浏览器环境甚至是Node.js环境中无法执行。
&＃xff08;2&＃xff09;Babel是一个广泛使用的转码器&＃xff0c;可以将ES6代码转为ES5代码&＃xff0c;从而在现有环境执行。
&＃xff08;3&＃xff09;这意味着&＃xff0c;你可以现在就用 ES6 编写程序&＃xff0c;而不用担心现有环境是否支持。

文件目录如下

2.安装使用

安装命令行转码工具
Babel提供babel-cli工具&＃xff0c;用于命令行转码。它的安装命令如下&＃xff1a;

npm install -g babel-cli
#查看是否安装成功
babel --version


3、初始化项目

npm init -y


4、创建文件 src/test1.js&＃xff0c;写入es6语法代码&＃xff08;需要转换的文件&＃xff09;

//es6语法
let name &＃61; "this is java!"
const title &＃61; "张三";
let arr &＃61; [1,2,3,4,5,6];
let newarr &＃61; arr.map(a&＃61;>a*2);
console.log(name);
console.log(title);
console.log(newarr);


5、创建、配置 .babelrc

Babel的配置文件是.babelrc&＃xff0c;存放在项目的根目录下&＃xff0c;该文件用来设置转码规则和插件

{
"presets": ["es2015"],
"plugins": []
}


6、安装转码器&＃xff0c;在项目中安装

npm install --save-dev babel-preset-es2015


7、开始转码

执行完之后我们执行babel src -d dist&＃xff0c;这个的意思是将src所有的文件都编译成ES2015格式放入dist目录之下。

babel src -d dist