1、什么是Gulp

gulp.js 是一种基于流的,代码优于配置的新一代构建工具。

Gulp 和 Grunt 类似。但相比于 Grunt 的频繁的 IO 操作,Gulp 的流操作,能更快地完成构建。

2、Gulp特性

  • 使用方便

通过代码优于配置的策略,Gulp可以让简单的任务简单,复杂的任务更可管理。

  • 构建快速

通过流式操作,减少频繁的 IO 操作,更快地构建项目。

  • 插件高质

Gulp 有严格的插件指导策略,确保插件能简单高质的工作。

  • 易于学习

少量的API,掌握Gulp可以毫不费力。构建就像流管道一样,轻松加愉快。

3、Gulp安装

Gulp是基于 Node.js的,故要首先安装 Node.js

 npm install -g gulp
npm install —-save-dev gulp

4、Gulp使用

Gulp的任务都是以插件的形式存在,本次示例以 gulp-jshint 为例,展示Gulp的常规用法。

安装 gulp-jshint

 npm install gulp-jshint --save-dev

创建 gulpfile.js

gulp项目页 有一个 Sample gulpfile。如果不会写的话,直接参考一下就OK了。

 var gulp = require('gulp');
var jshint = require('gulp-jshint'); var paths = {
scripts: 'js/**/*.js',
}; gulp.task('lint', function() {
return gulp.src(paths.scripts)
.pipe(jshint())
.pipe(jshint.reporter('default'));
});

然后执行命令行

 gulp lint

即可。

5、Gulp总结

Gulp 相比于 Grunt 有很多优点,比较直观的:就是学习曲线比较平滑。比Grunt速度更快、配置更少。

当然,Gulp还有很多高级的特性,详见官方文档

Gulp插件列表

http://gulpjs.com/

Gulp:新一代前端构建利器的更多相关文章

  1. 仿async/await(一)and Gulp:新一代前端构建利器

    NET 4.5的async/await真是个神奇的东西,巧妙异常以致我不禁对其实现充满好奇,但一直难以窥探其门径.不意间读了此篇强文<Asynchronous Programming in C# ...

  2. 前端构建利器Grunt—Bower

    runt + Bower—前端构建利器 目前比较流行的WEB开发的趋势是前后端分离.前端采用重量级的Javascript框架,比如Angular,Ember等,后端采用restful API的Web ...

  3. 使用Gulp实现前端构建自动化

    使用Gulp实现前端构建自动化 安装 一.安装NodeJs Gulp的安装依赖于NodeJs的npm安装管理器 安装包下载地址 关于npm命令: 1. npm install <name> ...

  4. Grunt + Bower—前端构建利器(转)

    目前比较流行的WEB开发的趋势是前后端分离.前端采用重量级的Javascript框架,比如Angular,Ember等,后端采用restful API的Web Service服务,通过JSON格式进行 ...

  5. Grunt + Bower—前端构建利器

    目前比较流行的WEB开发的趋势是前后端分离.前端采用重量级的Javascript框架,比如Angular,Ember等,后端采用restful API的Web Service服务,通过JSON格式进行 ...

  6. 前端构建大法 Gulp 系列 (四):gulp实战

    前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gulp专家 前 ...

  7. 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gulp专家

    系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...

  8. 前端构建大法 Gulp 系列 (二):为什么选择gulp

    系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...

  9. 前端构建大法 Gulp 系列 (一):为什么需要前端构建

    系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...

随机推荐

  1. C# winform的WebBrowser非常规编程(强烈推荐)

    本文章被今日头条推荐 1.在WebBrowser中实现抓取301和302协议 在WebBrowser中抓取301和302协议目前官方提供的组件远远不够,需要借助HttpMonitor.dll.这个组件 ...

  2. Python学习笔记(1):列表元组结构

    Python的列表元组功能强大,令人印象深刻.一是非常灵活,二是便于集体操作.特别是以元组作为列表项的结构,和数据访问的结果能够对应起来,和习惯的二维表理解上也一致,有很多的用途. 以学习笔记(3)中 ...

  3. 关于mysql备份说明

    #mysqlpump压缩备份vs数据库 三个并发线程备份,消耗时间:222smysqlpump -uzjy -p -h192.168.123.70 --single-transaction --def ...

  4. C#代码像QQ的右下角消息框一样,无论现在用户的焦点在哪个窗口,消息框弹出后都不影响焦点的变化,那么有两种方法

    你QQ的右下角消息框一样,无论现在用户的焦点在哪个窗口,消息框弹出后都不影响焦点的变化,那么有两种方法: 要么重写需要弹出的窗体的事件: protected override CreateParams ...

  5. IPv6正则表达式

    斯蒂芬·瑞恩写了一个非常有用的正则表达式,可用于匹配任何一个合法的IPv6地址.以下为正则表达式的代码: ^\s*((([0-9A-Fa-f]{1,4}:){7}([0-9A-Fa-f]{1,4}|: ...

  6. 启动和JQuery绑定--AngularJS学习笔记(二)

    上一篇简单的分析了AngularJS的项目结构,后面就开始分析具体的源代码了. 从angularFiles.js中的定义可以看出有几个文件直接位于src根目录,并不是隶属于某个模块.这几 个分别是mi ...

  7. http协议读书笔记2-连接管理

    一.http是如何使用tcp连接的? http连接本质就是tcp连接和一些使用连接的规则.所有的http通讯都是由tcp/ip来承载的.tcp/ip是全球计算机及网络设备都在使用的一种常用的分组交换的 ...

  8. OsmocomBB && Motorora C118

    OsmocomBB 编译安装: http://www.cnblogs.com/hangxin1940/p/3375216.html ##准备: C118 ![C118](http://images.c ...

  9. chrome start.js报错

    是由 chrome 插件 “电脑管家广告过滤” 引起的 并且,在用户电脑上还出现了这个插件拦截正常请求的情况 如果同时报以下错误: Uncaught TypeError: Cannot read pr ...

  10. WebService SendTimeout 超时问题

    System.TimeoutException: 请求通道在等待 00:01:00 以后答复时超时.增加传递给请求调用的超时值,或者增加绑定上的 SendTimeout 值.分配给此操作的时间可能是更 ...