ECMAScript 6 学习系列课程 （ES6 gulp+babel 语法转化的相关用法）

目前来讲ES6语法的支持程度还不够完美，很多特性都没有支持到，但是ES6的语法糖的确很诱人，对于开发者来讲，我们有很想尝试使用，所以我们通常会讲ES6语法转换为ES5语法到产品环境使用，这个过程中会用到转换库，现在最好，最稳定的当属babel家族了。

在真正项目中，我们会使用gulp进行项目架构，那么使用gulp和babel改如何实现对ES6语法的转化呢？

首先确认一下我当前mac环境的相关配置：

NodeJS： 6.x

Gulp: 3.9.

我们来看一下代码：

首先我们需要在package.json中配置相关依赖：

    "gulp": "^3.9.0",
    "babel-preset-es2015": "^6.6.0",
    "babelify": "^7.2.0",
    "browserify": "^13.0.0",

browserify: 主要用于js代码模块整合编译。
babelify: 用于转化的核心库。
babel-preset-es2015: 用于预设转化语法形式（在最新版本的node环境需要配置这个库，否则不生效，亲测！）

var gulp         = require('gulp');
var browserify   = require('browserify');
var babelify     = require('babelify');  

var bundler = browserify({
        entries: config.browserify.entries,
        debug: true,
        cache: {},
        packageCache: {},
        fullPaths: true
    }, watchify.args);

    var transforms = [
        babelify.configure({
            presets: ['es2015']
        }),
        ngAnnotate,
        brfs
    ];

    transforms.forEach(function(transform) {
        bundler.transform(transform);
    });

配置好以后，我们执行gulp task的时候，会将代码自动转换了。上面只粘贴了主要的代码。大家仅供参考。