Hbuilder中添加Babel自動編譯

[說明：轉載請標明出處。]

Hbuilder是一個不錯的H5開發IDE。

Babel是EMCAScript最新標準的編譯器，不少ES的最新特性均可以在Babel中嘗試。

若是能夠有辦法在Hbuilder中直接使用ES6，並經過Babel自動轉化爲ES5，那麼對於使用ES6+Hbuilder進行開發調試將會很是方便。

簡單作了些配置，能夠經過如下步驟達到目的。

1. Hbuilder配置 - 打開ES6

    

2. 安裝NPM
   1. 下載NPM安裝
   2. 經過NPM安裝babel-cli

      npm install --global babel-cli

   3. 安裝babel preset

      npm install --global babel-preset-env

3. 配置Hbuilder中的預編譯器設置

   根據實際狀況，填寫以上信息。

4. 測試JS文件保存，自動生成babel轉換後的JS代碼

　　　　每次項目中的JS文件保存後，都會將編譯後的代碼文件放在項目中dist/下。

以上步驟，在windows環境下驗證。