gulp-API介绍

Posted 2020-09-07 zhangzhongjiang

使用gulp，一般只需要用4个API：gulp.src()，gulp.dest()，gulp.task()，gulp.watch()。

1. gulp.src()

用来获取流的，但是要注意的是这个流里的内容不是原始的文件流，而是一个虚拟文件对象流（vinyl files），这个虚拟文件对象中存储着原始文件的路径、文件名、内容等信息，这个我们暂时不用去深入理解，只需要的简单的理解可以用这个方法读取你需要操作的文件就行了。

语法为： 

gulp.src(globs[ , options ])

globs参数是文件匹配模式（类型正则表达式），用来匹配文件路径（包括文件名），也可以直接指定某个具体的文件路径。

options为可选参数，通常情况下不需要用到。

 

2. gulp.dest()

用来写文件的，其语法为：

gulp.dest(path[ , options])

path为写入文件的路径。

options，可选的参数对象，通常用不到。

gulp的使用流程一般是：首先通过 gulp.src()方法获取我们想要处理的文件流，然后把文件流通过 pipe 方法导入到gulp插件中，最后把经过插件处理后的流再通过pipe方法导入到gulp.dest()中，gulp.dest()方法则把流中的内容写入到文件中。

tips：给gulp.dest()传入的路径参数，只能用来指定要生成的文件的目录，而不能指定生成文件的文件名，它生成文件的文件名使用的是导入到它的文件流自身的文件名，所以生成的文件名是由导入到它的文件流决定的。

 

3. gulp.task()

用来定义任务，内容使用的是Orchestrator，其语法为：

gulp.task( name [ , deps ] , fn )

name：任务名；

deps：是当前定义的任务需要依赖的其他的任务，为一个数组。当前定义的任务会在所有依赖的任务执行完毕后才开始执行。如果没有依赖，则可以省略这个参数。

fn：为任务函数，我们把任务要执行的代码都写在里面。该参数也是可选的。

gulp.task(\'mytask\', [\'array\',\'of\',\'task\',\'name\' ], function(){ //定义一个有依赖的任务
      // do something 
})

gulp中执行多个任务，可以通过任务依赖来实现。例如想要执行 one，two，three 这三个任务，我们可以定义一个空的任务，然后把那三个任务当作这个空的任务的依赖就行了。

//只要执行了default任务，就相当于把one，two, three 这三个任务执行了。
gulp.task(\'default\',[\'one\',\'two\',\'three\']);

具体详情（含异步）请点击此链接

 

4. gulp.watch()

gulp.watch()用来监视文件的变化，当文件发生变化后，我们可以利用它来执行相应的任务，例如文件压缩等。其语法为：

gulp.watch(glob [ , opts] , tasks)

glob：为要监视的文件匹配模式，规则和用法与 gulp.src()方法中的glob相同。

opts：为一个可选的配置对象，通常不需要用到。

tasks：为文件变化后要执行的任务，为一个数组。

 

其他各种插件，js压缩、css压缩、html压缩、图片压缩......