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. sqlserver自定义函数的创建与调用

    sqlserver中有系统提供的函数,像avg.sum.getdate()等,用户还可以自定义函数. 用户自定义的函数包括:标量函数和表值函数,其中标量函数和系统函数的用法一样,表值函数根据主体的定义 ...

  2. UHF桌面式发卡器

    UHF桌面式发卡器: http://www.rr-rfid.com/index.php/pro_view/95  本文用菊子曰发布

  3. 爬虫神器xpath的用法(三)

    xpath的多线程爬虫 #encoding=utf-8 ''' pool = Pool(4) cpu的核数为4核 results = pool.map(爬取函数,网址列表) ''' from mult ...

  4. Java 定时任务

    control 类 Date nowDate = new Date(); SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd HH: ...

  5. pip 豆瓣镜像使用

    pip install -i https://pypi.douban.com/simple/ flask 要用https的 https://pip.pypa.io/en/latest/user_gui ...

  6. How do I check if a type is a subtype OR the type of an object?

    To check if a type is a subclass of another type in C#, it's easy: typeof (SubClass).IsSubclassOf(ty ...

  7. iOS 渐变提示。Labe自动换行

    UILabel *noticeLabel = [[UILabel alloc]init]; noticeLabel.text = @"当前账号已失效果,已清除当前账号已失效果,已清除当前账号 ...

  8. android sdk

    android sdk 网站 为什么google 的网站都上不去. http://www.androiddevtools.cn/

  9. mysql 优化配置参数详解

    在 my.cnf 文件中 各设置参数的含义如下: innodb_data_home_dir 这是InnoDB表的目录共用设置.如果没有在 my.cnf 进行设置,InnoDB 将使用MySQL的 da ...

  10. VMware Workstation安装RedHat Linux 9

    RedHatLinux是目前世界上使用最多的Linux操作系统.因为它具备最好的图形界面无论是安装.配置还是使用都十分方便.下面我将介绍使用VMware Workstation安装RedHat Lin ...