目錄(?)[-]

2. 1什么是Gulp
3. 2Gulp特性
4. 3Gulp安裝
5. 4Gulp使用
6. 5Gulp總結(jié)

1、什么是Gulp

gulp.js 是一種基于流的，代碼優(yōu)于配置的新一代構(gòu)建工具。

Gulp 和 Grunt 類似。但相比于 Grunt 的頻繁的 IO 操作，Gulp 的流操作，能更快地完成構(gòu)建。

2、Gulp特性

• 使用方便

通過代碼優(yōu)于配置的策略，Gulp可以讓簡單的任務(wù)簡單，復(fù)雜的任務(wù)更可管理。

• 構(gòu)建快速

通過流式操作，減少頻繁的 IO 操作，更快地構(gòu)建項(xiàng)目。

• 插件高質(zhì)

Gulp 有嚴(yán)格的插件指導(dǎo)策略，確保插件能簡單高質(zhì)的工作。

• 易于學(xué)習(xí)

少量的API，掌握Gulp可以毫不費(fèi)力。構(gòu)建就像流管道一樣，輕松加愉快。

3、Gulp安裝

Gulp是基于 Node.js的，故要首先安裝 Node.js

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

4、Gulp使用

Gulp的任務(wù)都是以插件的形式存在，本次示例以 gulp-jshint 為例，展示Gulp的常規(guī)用法。

安裝 gulp-jshint

npm install gulp-jshint --save-dev

創(chuàng)建 gulpfile.js

gulp項(xiàng)目頁 有一個(gè) Sample gulpfile。如果不會(huì)寫的話，直接參考一下就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'));
});

然后執(zhí)行命令行

gulp lint

即可。

5、Gulp總結(jié)

Gulp 相比于 Grunt 有很多優(yōu)點(diǎn)，比較直觀的：就是學(xué)習(xí)曲線比較平滑。比Grunt速度更快、配置更少。

當(dāng)然，Gulp還有很多高級(jí)的特性，詳見官方文檔

Gulp插件列表

http:///