为什么要使用babel?
目前ECMAScript 2015(ES6)已经极为流行了,只不过目前浏览器还不兼容。所以babel出现了。
babel的特点
babel是一个js转换器(平台),它的出现使得我们可以立即使用ES6的语法,特点如下:
1.目前公认的对ES6规范兼容最高的工具
2.不断更新并且支持ES6的转化,我们用babel能做大量的新语法的实验
3.内置优化器,能够在一定程度上加快和提高我们的JS运行性能。
安装(官方建议安装到项目目录下)
npm install babel-cli --save-dev
开始接触转化
ES2015中定义变量用var,同类的还有const(类似于常量)。我们尽可能的要用let、const来代替var。
而这样的代码在目前的浏览器是不能运行的,所以需要用babel来转化。
加入babel预设插件
刚才我们装的babel-cli只是一个“母体”。要想让它实现我们具体的需求还要各种“插件”。
比如babel-preset-es2015
npm install babel-preset-es2015 --save-dev
此外babel还需要一个配置文件.babelrc
{
"presets":["es2015"]
}
babel作用演练
1.新建一个test.js
let name = "zhagnsan";
console.log(name);
2.使用babel转化
$ babel test.js -o test-babel.js
这样就利用babel把test.js 转化输出为 test-babel.js了,
转化成了我们es5的代码
"use strict";
var name = "zhagnsan";
console.log(name);