前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Gulp基本用法

Gulp基本用法

作者头像
epoos
发布2022-06-06 15:32:51
7160
发布2022-06-06 15:32:51
举报
文章被收录于专栏:epoos.comepoos.com

Gulp是一个模块化打包工具。 Gulp本身只有几个入口,支持他拥有强大功能的是各种各样的插件。 Gulp的使用看起来非常简单,只需要一个一个任务链式执行就可以了,它还可以与Webpack结合起来使用 比如将Webpack作为一个插件来处理ES6转换为ES5的操作。 下面记录一下Gulp的API以及一些用到的插件。

代码语言:javascript
复制
gulp.src(globs[, options])

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

globs:一种匹配文件的规则。


代码语言:javascript
复制
gulp.dest(path[, options])

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

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


代码语言:javascript
复制
gulp.task(name[, deps], fn)

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

Orchestrator: 一个执行并发任务的库。


代码语言:javascript
复制
gulp.watch(glob[, opts], tasks)

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

glob:

类型: String or Array

一个 glob 字符串,或者一个包含多个 glob 字符串的数组,用来指定具体监控哪些文件的变动。

eg:

代码语言:javascript
复制
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...');
});

相关链接:

gulpjs中文官网

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2016-12-20,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 相关链接:
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档