ES6编译器—Babel 入门教程

Babel是一个广泛使用的转码器，可以将ES6代码转为ES5代码，从而在现有环境执行。这意味着，你可以现在就用ES6编写程序，而不用担心现有环境是否支持。

一、准备工作

1.安装babel:npm install babel-cli -g

2.babelrc的设置：.babelrc是babel的配置文件，需要进行一系列的设置

二、配置文件.babelrc

Babel的配置文件是.babelrc，存放在项目的根目录下。使用Babel的第一步，就是配置这个文件。

该文件用来设置转码规则和插件，presets字段设定转码规则，plugins设置插件。基本格式如下：

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

preset:官方提供以下转码规则集，你可以根据需要安装：

# ES2015转码规则   $ npm install--save-dev babel-preset-es2015

# react转码规则        $ npm install--save-dev babel-preset-react

# ES7不同阶段语法提案的转码规则（共有4个阶段），选装一个

$ npm install--save-dev babel-preset-stage-0

$ npm install--save-dev babel-preset-stage-1

$ npm install--save-dev babel-preset-stage-2

$ npm install--save-dev babel-preset-stage-3

安装完了之后，可以根据需要将这些规则加入.babelrc

{ "presets":["es2015","react","stage-2"],"plugins":[] }

三、编译方式

这里提供多种方式来编译ES6代码，可根据需要来选择适合的方式。

1.命令行转码babel-cli

2.babel-node

3.babel-register

4.babel-core

5.babel-polyfill

6.浏览器环境

7.在线转换