前端构建工具gulpjs的使用介绍及技巧

原文:http://www.cnblogs.com/2050/p/4198792.html

一、gulp安装。

先安装node.js,在安装gulp,全局安装:npm install gulp -g; 局部安装: npm install gulp --save -dev;

--save 可以将gulp版本号写入package.json文件中。

二、gulp使用。

建立gulpfile.js文件。定义任务,运行 gulp +任务name。

三、gulp相关api。

使用gulp,仅需知道4个API即可:gulp.task()、gulp.src()、gulp.dest()、gulp.watch();

1、gulp.src();

作用:任务所执行的文件,任务的源头。

语法:gulp.src(globs[, options]);

依赖流方法:gulp.src().pipe('路径');

globs参数是文件匹配模式(类似正则表达式),用来匹配文件路径(包括文件名),当然这里也可以直接指定某个具体的文件路径。当有多个匹配模式时,该参数可以为一个数组。
options为可选参数。通常情况下我们不需要用到。

2、gulp.dest();

作用:任务所执行的结果文件,任务的尽头。

语法:gulp.dest(path[,options]);

path为写入文件的路径
options为一个可选的参数对象,通常我们不需要用到;

3、gulp.task();

作用:形成任务命令;

语法:gulp.task(name[, deps],fn);

name 为任务名
deps 是当前定义的任务需要依赖的其他任务,为一个数组。当前定义的任务会在所有依赖的任务执行完毕后才开始执行。如果没有依赖,则可省略这个参数
fn 为任务函数,我们把任务要执行的代码都写在里面。该参数也是可选的。

4、gulp.watch();

作用:监听文件,是任务执行,类似事件绑定;

语法:gulp.watch(glob[, opts],tasks);

glob 为要监视的文件匹配模式,规则和用法与gulp.src()方法中的glob相同。
opts 为一个可选的配置对象,通常不需要用到
tasks 为文件变化后要执行的任务,为一个数组。


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值