博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
GULP入门之API(二)
阅读量:6992 次
发布时间:2019-06-27

本文共 3616 字,大约阅读时间需要 12 分钟。

GULP的API

gulp.src(globs[, options])  

输出(Emits)符合所提供的匹配模式(glob)或者匹配模式的数组(array of globs)的文件。 将返回一个  的 它可以被  到别的插件中。

gulp.src('client/templates/*.jade')  .pipe(jade())  .pipe(minify())  .pipe(gulp.dest('build/minified_templates'));

globs:类型: String 或 Array   所要读取的 glob 或者包含 globs 的数组

options.buffer:类型: Boolean 默认值: true   如果该项被设置为 false,那么将会以 stream 方式返回 file.contents 而不是文件 buffer 的形式。这在处理一些大文件的时候将会很有用。**注意:**插件可能并不会实现对 stream 的支持。

options.read:类型: Boolean 默认值: true   如果该项被设置为 false, 那么 file.contents 会返回空值(null),也就是并不会去读取文件。

options.base:类型: String 默认值: 将会加在 glob 之前 (请看 ) 

如, 请想像一下在一个路径为 client/js/somedir 的目录中,有一个文件叫 somefile.js :

gulp.src('client/js/**/*.js') // 匹配 'client/js/somedir/somefile.js' 并且将 `base` 解析为 `client/js/`  .pipe(minify())  .pipe(gulp.dest('build'));  // 写入 'build/somedir/somefile.js'gulp.src('client/js/**/*.js', { base: 'client' })  .pipe(minify())  .pipe(gulp.dest('build'));  // 写入 'build/js/somedir/somefile.js'

 

gulp.dest(path[, options])

能被 pipe 进来,并且将会写文件。并且重新输出(emits)所有数据,因此你可以将它 pipe 到多个文件夹。如果某文件夹不存在,将会自动创建它。

gulp.src('./client/templates/*.jade')  .pipe(jade())  .pipe(gulp.dest('./build/templates'))  .pipe(minify())  .pipe(gulp.dest('./build/minified_templates'));

文件被写入的路径是以所给的相对路径根据所给的目标目录计算而来。类似的,相对路径也可以根据所给的 base 来计算。 请查看上述的 gulp.src 来了解更多信息。

path:类型: String or Function 文件将被写入的路径(输出目录)。也可以传入一个函数,在函数中返回相应路径,这个函数也可以由  来提供。

options.cwd:类型: String 默认值: process.cwd() 输出目录的 cwd 参数,只在所给的输出目录是相对路径时候有效。

options.mode:类型: String 默认值: 0777   八进制权限字符,用以定义所有在输出目录中所创建的目录的权限。

 

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

定义一个使用 实现的任务(task)

gulp.task('somename', function() {  // 做一些事});

name 任务的名字,如果你需要在命令行中运行你的某些任务,那么,请不要在名字中使用空格。

deps 类型: Array 一个包含任务列表的数组,这些任务会在你当前任务运行之前完成。

gulp.task('mytask', ['array', 'of', 'task', 'names'], function() {  // 做一些事});

注意: 你的任务是否在这些前置依赖的任务完成之前运行了?请一定要确保你所依赖的任务列表中的任务都使用了正确的异步执行方式:使用一个 callback,或者返回一个 promise 或 stream。

fn 该函数定义任务所要执行的一些操作。通常来说,它会是这种形式:gulp.src().pipe(someplugin())

异步任务支持 任务可以异步执行,如果 fn 能做到以下其中一点:

接受一个 callback
// 在 shell 中执行一个命令var exec = require('child_process').exec;gulp.task('jekyll', function(cb) {  // 编译 Jekyll  exec('jekyll build', function(err) {    if (err) return cb(err); // 返回 error    cb(); // 完成 task  });});
返回一个 stream
gulp.task('somename', function() {  var stream = gulp.src('client/**/*.js')    .pipe(minify())    .pipe(gulp.dest('build'));  return stream;});
返回一个 promise
var Q = require('q');gulp.task('somename', function() {  var deferred = Q.defer();  // 执行异步的操作  setTimeout(function() {    deferred.resolve();  }, 1);  return deferred.promise;});

对于这个例子,让我们先假定你有两个 task,"one" 和 "two",并且你希望它们按照这个顺序执行:

  1. 在 "one" 中,你加入一个提示,来告知什么时候它会完成:可以再完成时候返回一个 callback,或者返回一个 promise 或 stream,这样系统会去等待它完成。

  2. 在 "two" 中,你需要添加一个提示来告诉系统它需要依赖第一个 task 完成。

因此,这个例子的实际代码将会是这样:

var gulp = require('gulp');// 返回一个 callback,因此系统可以知道它什么时候完成gulp.task('one', function(cb) {    // 做一些事 -- 异步的或者其他的    cb(err); // 如果 err 不是 null 或 undefined,则会停止执行,且注意,这样代表执行失败了});// 定义一个所依赖的 task 必须在这个 task 执行之前完成gulp.task('two', ['one'], function() {    // 'one' 完成后});gulp.task('default', ['one', 'two']);

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

监视文件,并且可以在文件发生改动时候做一些事情。它总会返回一个 EventEmitter 来发射(emit) change 事件。

var watcher = gulp.watch('js/**/*.js', ['uglify','reload']);watcher.on('change', function(event) {  console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');});
gulp.watch('js/**/*.js', function(event) {  console.log('File ' + event.path + ' was ' + event.type + ', running tasks...');}); //event.type  发生的变动的类型:added, changed 或者 deleted。 //event.path  触发了该事件的文件的路径。

 

转载于:https://www.cnblogs.com/myzy/p/6265546.html

你可能感兴趣的文章
【Java】ArrayList和LinkedList的区别
查看>>
Java面试题收集学习整理1
查看>>
[原创]测试职业发展,换工作要考虑什么?
查看>>
ASP.Net中自定义Http处理及应用之HttpModule篇
查看>>
无锁算法CAS 概述
查看>>
【SQL 代码】Sql分页(自用)
查看>>
Java的递归算法
查看>>
浅谈android4.0开发之GridLayout布局
查看>>
struts开发<struts中的action详细配置. 二>
查看>>
SQL语句技巧:查询存在一个表而不在另一个表中的数据记录
查看>>
[jPlayer]一分钟部署jPlayer
查看>>
关于oracle动态视图v$datafile和v$datafile_header(转)
查看>>
关于composer
查看>>
WPF中的动画——(三)时间线(TimeLine)
查看>>
POJ 2387 Til the Cows Come Home (最短路+Dijkstra)
查看>>
无主之地1
查看>>
mysql查询处理顺序
查看>>
微信公众平台教程,注册申请、认证、开发、推广营销,教你怎么用微信公众号...
查看>>
Senparc.Weixin.MP SDK 微信公众平台开发教程(十三):地图相关接口说明
查看>>
SQL Server2008 删除登录记录
查看>>