前端自动化构建工具Gulp---------------基本使用

gulp 安装及使用

1. 安装gulp安装依赖

//安装gulp的同时 会安装一个gulp-cli的模块。
//后续我们可以通过gulp命令来执行我们的任务
$ yarn init
$ yarn add gulp

2. 新建一个入口文件

    1. 在目录下新建`gulpfile.js` 文件，作为gulp的入口文件。
    2. 这个文件运行在node.js中 所以我们可以在这个文件中使用CommonJS 的规范。	
   3. `gulpfile.js`文件中定义构建任务的方式：通过导出函数成员的方式
   

3. 创建任务的两种方式-推荐使用导出函数成员的方式

	// 导出函数成员的方式创建指定任务 ---yarn gulp foo
	exports.foo = done => {
	        console.log('foo task')
	        done() //标识任务完成   --后续会说明（异步任务）
	    } 
	    
	// 创建默认事件任务   -- yarn gulp
	exports.default = done => {
	        console.log('defaul task working~')
	        done()
	    }
	    
	//这种创建任务的方式已经不被推荐 推荐上面的导出函数成员的方式 --yarn gulp bar   
	const gulp = require('gulp')
	gulp.task('bar', done => {
	    console.log('bar')
	    done()
	})

gulp 创建组合任务- 私有任务

摘自gulp 官网：series() 和 parallel()，允许将多个独立的任务组合为一个更大的操作。这两个方法都可以接受任意数目的任务（task）函数或已经组合的操作。series() 和 parallel() 可以互相嵌套至任意深度。

// 任务一
const task1 = done => {
    setTimeout(() => {
        console.log('task1 working~')
        done()
    }, 1000)
}
//任务二
const task2 = done => {
    setTimeout(() => {
        console.log('task2 working~')
        done()
    }, 1000)
}
//任务三
const task3 = done => {
    setTimeout(() => {
        console.log('task3 working~')
        done()
    }, 1000)
}

series--------顺序执行

让多个任务按照顺序依次执行 
series 是一个函数 每一个参数都是一个任务
当使用 series() 组合多个任务（task）时，任何一个任务（task）的错误将导致整个任务组合结束，并且不会进一步执行其他任务。

const { series } = require('gulp')
// --  yarn gulp mome1
exports.mome1 = series(task1, task2, task3)

parallel--------同时执行

让多个任务同时执行
parallel 是一个函数 每一个参数都是一个任务
当使用 parallel() 组合多个任务（task）时，一个任务的错误将结束整个任务组合的结束，但是其他并行的任务（task）可能会执行完，也可能没有执行完。

const {  parallel } = require('gulp')
// --   yarn gulp memo
exports.memo = parallel(task1, task2, task3)