babel沒法編譯？

ECMAScript 6(ES6)的發展或者說普及之快能夠說是不可思議的，對不少人來講ECMAScript 5(ES5)都還普及呢。現代瀏覽器對ES6新特新或多或少的有些支持，但支持度不高，因此要想在瀏覽器中直接使用ES6的新特性，還得等上一段時間。

對ES6的普及起到相當重要的就不得不說babel了。babel能夠將ES6代碼完美地轉換爲ES5代碼，因此咱們不用等到瀏覽器的支持就能夠在項目中使用ES6的特性。

對於剛開始使用babel的人，可能會碰到一些問題，由於網上對於babel的使用教程基本上是針對babel 6以前的版本，而babel 6對於以前版本有一些變化。

• 由於以前版本只要安裝一個babel就能夠用了，因此以前的版本包含了一大堆的東西，這也致使了下載一堆沒必要要的東西。因此babel 6拆分紅兩個包：babel-cli和babel-core。若是你想要在CLI(終端或REPL)使用babel就下載babel-cli，若是想要在node中使用就下載babel-core。

• babel 6已結儘量的模塊化了，若是還用babel 6以前的方法轉換ES6，它會原樣輸出，並不會轉化，由於須要安裝插件。若是你想使用箭頭函數，那就得安裝箭頭函數插件npm install babel-plugin-transform-es2015-arrow-functions。

下面來實踐下(命令行使用babel)。

安裝babel:

npm install -g babel

命令行轉化js文件：

babel es6.js

提示：

The CLI has been moved into the package `babel-cli`. npm install -g babel-cli 

安裝babel-cli：

npm install -g babel-cli

再次轉化：

babel es6.js

命令行輸出：

[1, 2, 3].map(x => x * x)

能夠看到並無像指望的那樣轉化爲ES5，由於沒有安裝插件。上面使用了箭頭函數，因此要安裝箭頭函數插件。可是這樣太麻煩，若是使用了ES6的其餘特性，還要安裝其餘插件，能夠只下載一個插件：

npm install babel-preset-es2015

這個插件包含了其餘插件。

安裝完插件後，運行：

babel es6.js --presets es2015

輸出：

[1, 2, 3].map(function (x) { return x * x; })

上面已經獲得想要的結果了。

babel能夠將ES6文件轉換輸出到另外一個文件：

babel es6.js -o es5.js # 或者 babel es6.js --out-file es5.js

也能夠用於轉換整個目錄：

babel -d lib/ src/

運行babel-node命令能夠直接在命令行運行ES6代碼:

babel-node

> console.log([1,2,3].map(x => x * x)) [ 1, 4, 9 ]

也能夠直接運行ES6文件。

babel es6.js

> [1, 2, 3].map(function (x) { return x * x; })

(完)