前面的文章說到了react 15的一些特性，眾所周知react搭配es6或者叫es2015的開發(fā)模式更加的方便快捷。不過提到es2015這個畢竟沒有被瀏覽器廣泛支持的規(guī)范，要想能夠快快樂樂的應(yīng)用起來，就少不了將未來將要被瀏覽器支持但現(xiàn)在支持還不全面的規(guī)范轉(zhuǎn)換成現(xiàn)有規(guī)范的工具了。這個好像選擇不多，是的好像就是babel了，關(guān)于babel，本文不會去涉及它內(nèi)部的實(shí)現(xiàn)原理。因?yàn)樽罱诩嫒菪碌膔eact的時候，不可避免的涉及到babel的更新，開始被那一串配置搞的頭大，所以就認(rèn)真的學(xué)習(xí)了一下，來跟大家分享一下。這里的主要目的是babel的一些列配置文件的處理，所以關(guān)于babel的安裝之類的請猛戳babel官網(wǎng)。

關(guān)于babel的配置，主要是體現(xiàn)在項(xiàng)目根目錄下的.babelrc文件中。在babel6之前的版本還支持其他的一些配置選項(xiàng)，更新之后babel配置文件只支持presets，plugins兩個參數(shù)。不向后兼容，所以其他的參數(shù)是會報(bào)類似下面的錯誤：

ReferenceError: [BABEL] XXXX.jsx: Unknown option: stage(或loose)。

所以我們所有的配置都是基于上面兩個參數(shù)上來配置的。兩者差別可以認(rèn)為presets指定的部分是babel集成好的插件集，可以用來應(yīng)對某一類問題例如es2015就是用來解析es2015用到的插件集。當(dāng)然可能會有某些情況是比較個例的，可能用到但大部分情況下不會出現(xiàn)的插件，你就可以在plugins中配置

一、presets：babel已經(jīng)集成好的插件集。包括以下六種：

1）es2015: 處理es2015基本的語法，安裝對應(yīng)語句：

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

2）react：主要用來處理react所用到的jsx語法等。安裝：

npm install npm install --save-dev babel-preset-react 

3）stage-0:主要處理do語句和bind方法。還包括stage-1,stage-2,stage-3的全部插件。