摘要自:https://www.cnblogs.com/2050/p/4198792.html
使用gulp仅需知道4个api即可,gulp.task()
、gulp.dest()
、gulp.src()
,gulp.watch()
。
在gulp中,使用的是Nodejs中的stream(流),首先获取到需要的stream,然后可以通过stream的pipe()
方法把流导入到你想要的地方,比如Gulp的插件中,经过插件处理后的流又可以继续导入到其他插件中,当然也可以把流写入到文件中。所以Gulp是以stream为媒介的,它不需要频繁的生成临时文件,这也是Gulp的速度比Grunt快的一个原因。
1、gulp.src()
gulp.src(globs[, options])
2、gulp.dest():用来写文件的:
gulp.dest(path[,options])
gulp的使用流程一般是这样子的:首先通过gulp.src()方法获取到我们想要处理的文件流,然后把文件流通过pipe方法导入到gulp的插件中,最后把经过插件处理后的流再通过pipe方法导入到gulp.dest()中,gulp.dest()方法则把流中的内容写入到文件中,这里首先需要弄清楚的一点是,我们给gulp.dest()传入的路径参数,只能用来指定要生成的文件的目录,而不能指定生成文件的文件名,它生成文件的文件名使用的是导入到它的文件流自身的文件名,所以生成的文件名是由导入到它的文件流决定的,即使我们给它传入一个带有文件名的路径参数,然后它也会把这个文件名当做是目录名,例如
var gulp = require('gulp');
gulp.src('script/jquery.js')
.pipe(gulp.dest('dist/foo.js'));
//最终生成的文件路径为 dist/foo.js/jquery.js,而不是dist/foo.js
3、gulp.task():方法用来定义任务,内部使用的是Orchestrator,其语法为:
gulp.task(name[, deps], fn)
4、gulp.watch():用来监视文件的变化,当文件发生变化后,我们可以利用它来执行相应的任务,例如文件压缩
gulp.watch(glob[, opts], tasks)
通配符:
1、*
:匹配文件夹下所有文件,可替代a.js、x.y、abc
2、**
:匹配文件夹下所有文件夹,可替代abc、a/b.js、x/y/z,能匹配所有的目录和文件
3、**/*.js
:匹配foo.js、a/foo.js、a/b/foo.js。