gulp学习指南

安装 Gulp.js

Gulp 是基于 Node.js 的，故要首先安装 Node.js，完成之后执行下面的命令安装Gulp：

• npm install -g gulp
  //- 执行全局安装 gulp，这样在任何地方都可以进行 gulp 操作

安装完之后，要在我们的项目中使用，需要在项目根目录(可以 **按住shift键并右击鼠标 ** 在此处打开命令窗口(W))，打开命令行，然后执行下面的命令：

• npm -f init
  //- 强制生成一个 package.json，里面是一些常规的配置信息
• npm install gulp --save-dev
  //- 将 gulp 安装到项目目录内，并生成包依赖信息于 package.json 内的 devDependencies

安装Gulp插件

Gulp的任务都是以插件的形式存在的，所以在使用前，需要先安装我们用到的插件到项目目录内，插件的安装命令：

• npm install 插件名 --save-dev
  //- 多个插件可以用空格分隔
• npm install gulp-util gulp-uglify gulp-concat --save-dev
  //- 安装gulp-util、gulp-uglify 和 gulp-concat插件
  //- gulp-uglify：用于压缩js
  //- gulp-concat：用于合并文件

创建配置文件 gulpfile.js

要使用 Gulp 还需要进行相关的配置，把我们的插件载入进来；

在项目根目录内创建一个** gulpfile.js 文件**(必须是这个文件名!!)，内容如下：

• var gulp = require('gulp');
  var gutil = require('gulp-util');
  var uglify = require('gulp-uglify');
  var concat = require('gulp-concat');
  //- 通过 require() 载入我们需要用到的插件~
  gulp.task('concat', function () {
  gulp.src('./scripts/*.js')
  .pipe(uglify())
  .pipe(concat('jkd.min.js'))
  .pipe(gulp.dest('./build/js'));
  });
  gulp.task('default', ['concat']);

运行 Gulp

通过以上的配置之后，就可以开始运行Gulp对我们的项目进行相关的操作；
使用 gulp 命令，运行Gulp.js构建程序

• gulp
  //- 运行默认的 default task
  gulp concat
  //- 仅运行 concat 这一个 task

Gulp APIs

*　gulp.task(name[, deps], fn)
//- 定义一个 task,声明它的名称, 任务依赖, 和任务内容.gulp.src(globs[, options])
//- 读取文件,参数为文件路径字符串或数组, 支持通配符.gulp.dest(path[, options])
//- 写入文件, 作为pipe的一个流程.文件夹不存在时会被自动创建.gulp.watch(glob [, opts], tasks) or gulp.watch(glob [, opts, cb])//- 监控文件,执行任务.