近年來，ES6+ 越來越熱，各大瀏覽器和 node.js 對(duì)于該標(biāo)準(zhǔn)的支持度也越來越高，ES6+ 有很多新的特性，也提供了更多的 API，可以說它對(duì) ES5 進(jìn)行了很大的改善，使開發(fā)人員更好的使用 JavaScript。雖然現(xiàn)階段 node.js 新版本支持大部分的 ES6+ 特性，但還是不能直接使用全部的 ES6+ 語法來編寫程序直接運(yùn)行，例如無法使用 import/export，所以我們使用目前最主流的轉(zhuǎn)換工具 Babel 來幫助我們編寫ES6語法的代碼。

0x1 Babel

Babel 是目前最流行的轉(zhuǎn)碼工具，代碼編譯器，我們使用它來實(shí)現(xiàn)我們的功能。

0x2 準(zhǔn)備工作

首先需要在你的項(xiàng)目中安裝相關(guān)的包，執(zhí)行下面的命令

$ npm install --save-dev babel-cli babel-preset-env # babel-cli 和 es6+ 最新語法 
$ npm install --save-dev babel-preset-stage-0 # es6+ 階段性提案語法 stage-0 包含stage1,2,3
$ npm install --save-dev babel-register # 鉤子，在程序入口文件引入即可實(shí)現(xiàn)轉(zhuǎn)碼
$ npm install --save babel-polyfill # babel轉(zhuǎn)碼時(shí)不能識(shí)別一些全局對(duì)象的API，例如Object.assign，使用它可以解決這個(gè)問題

0x3 配置 .babelrc

在項(xiàng)目中新建 .babelrc 文件：

{
  "presets": [
    "env",
    "stage-0"
  ]
}

0x4 配置入口文件

加入您的項(xiàng)目的啟動(dòng)文件是 app.js，則我們可以新創(chuàng)建一個(gè)入口文件，例如在當(dāng)前目錄新建一個(gè)文件 bin.js：

// bin.js
require('babel-polyfill');
require('babel-register');
require('./app.js'); // 這個(gè)地方引入您的項(xiàng)目的啟動(dòng)文件

大工告成，最后運(yùn)行命令，即可完美轉(zhuǎn)碼并運(yùn)行 ES6+：

$ node bin.js

注意：因?yàn)槭褂昧?babel-register，這套配置會(huì)在代碼運(yùn)行的過程中進(jìn)行轉(zhuǎn)碼（內(nèi)存中），所以只適用于開發(fā)環(huán)境，不可用于生產(chǎn)環(huán)境

• Babel version：v6
• Node.js version：v8

簡書作者 小菜荔枝原創(chuàng) 轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)