以前的老项目了，写几篇gulp3的文章，后面再折腾一下gulp4

前提条件：

1. 安装了node
2. 安装了git
3. 安装了gulp3 # 具体操作：

1. 打开git bash 安装babel-core 、 gulp-babel 、 babel-preset-es2015、gulp-uglify、gulp-strip-debug

注意：如果安装的babel是7以下，则执行下面这行

$ npm install babel-core babel-preset-es2015  gulp-babel --save-dev

如果安装的babel是7及7以上，则执行下面这行

npm install @babel/core @babel/preset-env gulp-babel --save-dev

babel-core：作用是把 js 代码分析成 ast ，方便各个插件分析语法进行相应的处理。有些新语法在低版本 js 中是不存在的，如箭头函数，rest 参数，函数默认值等，这种语言层面的不兼容只能通过将代码转为 ast，分析其语法后再转为低版本 js。

babel-preset-es2015：一个打包了ES6特性的插件

gulp-babel：编译ES6

gulp-uglify：压缩js

gulp-strip-debug：去除代码之间的调试语句

2.在根目录创建gulpfile.js

3.gulpfile内引入文件

var gulp = require('gulp')
var babel = require('gulp-babel')
var uglify = require('gulp-uglify')         // 压缩js
var stripDebug = require('gulp-strip-debug')    // 去除调试代码

4.添加task任务

var folder = {
    'src':'src/',
    'dist':'dist/'
}
gulp.task("js",function(){
    gulp.src(folder.src + "js/*")       // 读取src/js文件夹下面的所有文件
    .pipe(babel())                      // 使用babel
    .pipe(uglify())                     // js代码压缩
    .pipe(stripDebug())                 // 去除全部调试语句
    .pipe(gulp.dest(folder.dist+"js/")) // 输出代码到dist/js目录下面
})

5.加入启动队列

gulp.task("default", ["js"])

6.启动gulp，完成

$gulp