简单搭建ES6测试环境

前提：已安装nodejs和cnpm（用nodejs自带的npm亦可）。

1、切换到测试文件夹下，初始化生成package.json

cnpm init -y

2、安装必要的扩展包

// browser-sync用于热更新，gulp用于自动化构建，babel相关用于将es6代码转换为es5

cnpm install --save-dev browser-sync gulp

cnpm install --save-dev gulp-babel babel-preset-env babel-core

3、创建.babelrc文件

// .babelrc文件内容

{ 'presets':['env'] }

4、创建gulpfile.js文件

// gulpfile.js文件（假设源文件目录为src，生成后目录为dist）

var gulp=require('gulp');

var browserSync=require('browser-sync').create();

var babel=require('gulp-babel');

var reload=browserSync.reload;

gulp.task('browser-sync',['es2015'],function(){

         browserSync.init({ server:'./' });

         gulp.watch('./src/*.js',['es2015']);

         gulp.watch('./src/*').on('change',reload);

});

gulp.task('es2015',function(){

         return gulp.src('./src/*.js') .pipe(babel()) .pipe(gulp.dest('./dist'));

});

gulp.task('default',['browser-sync']);

5、启动测试服务器

gulp