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环境下验证。