（最近一直搞angularjs.项目里非要用2个包管理器npm和bower，2个任务运行器webpage、gulp.我想BB。）
gulp是什么？
gulp是基于Nodejs的自动任务运行器， 她能自动化地完成 javascript/coffee/sass/less/html/image/css 等文件的的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成，并监听文件在改动后重复指定的这些步骤。在实现上，她借鉴了Unix操作系统的管道（pipe）思想，前一级的输出，直接变成后一级的输入，使得在操作上非常简单。通过本文，我们将学习如何使用Gulp来改变开发流程，从而使开发更加快速高效。
注：gulp 和 grunt 非常类似，但相比于 grunt 的频繁 IO 操作，gulp 的流操作，能更快地更便捷地完成构建工作。
gulp常用地址：
gulp官方网址：http://gulpjs.com
gulp插件地址：http://gulpjs.com/plugins
gulp 官方API：https://github.com/gulpjs/gulp/blob/master/docs/API.md
gulp 中文API：http://www.ydcss.com/archives/424
废话不多说，开干。。。
首先需要安装node.node自带npm管理包（node安装过程这里不详细讲。百度很多）
推荐使用淘宝的cnpm镜像，因为npm安装插件是从国外服务器下载，受网络影响大，可能出现异常，如果npm的服务器在中国就好了。淘宝cnpm官方网址
1.全局安装gulp
全局命令提示符执行 cnpm install gulp -g
查看是否安装成功 gulp -v
好，gulp的环境已经搞定了，接下来就是使用gulp,
2.gulp的实战
创建app文件夹。在文件夹里添加package.json文件（package.json是node的配置文件）
package.json的代码如下：
{
"name": "test",
"version": "1.0.0",
"description": "test gulp",
"homepage": "",
"author": {
"name": "lucky",
"email": "*****@qq.com"
},
"license": "ISC",
"devDependencies": {
"gulp": "^3.8.11",
"gulp-sass": "^2.3.2"
}
}
同时创建 src 文件夹 和 dist 文件夹
接下来下载依赖包。在项目目录下使用命令提示符执行 cnpm install
（注：package.json的注释需要全部删除。否则会报错！！！）
成功之后，会多了对应的依赖文件了，说明成功。如图
好了，在根目录下创建gulpfile.js文件
说明：gulpfile.js是gulp项目的配置文件，是位于项目根目录的普通js文件（其实将gulpfile.js放入其他文件夹下亦可）。
gulpfilejs 的代码如下：
//导入工具包 require('node_modules里对应模块')
var gulp = require('gulp'), //本地安装gulp所用到的地方
sass = require('gulp-sass');
//定义一个sass任务（自定义任务名称）
gulp.task('sass', function () {
gulp.src('src/sass/index.scss') //该任务针对的文件
.pipe(sass()) //该任务调用的模块
.pipe(gulp.dest('dist/css')); //将会在src/css下生成index.css
});
gulp.task('default',['sass']); //定义默认任务
接着，在src里面创建css文件,在src里面创建sass文件夹，并在sass文件夹中创建index.scss；
index.scss代码如下：
//sass style,如果不会sass语法，可百度
$primaryColor: #333;
$linkColor: #333;
body {
color: $primaryColor;
}
a{
color:nth($linkColor,1);
&:hover{
color:nth($linkColor,2);
}
}
接下来通过gulp 编译sass文件.
运行命令行 gulp sass (sass 是在gulpfilejs自定义任务名称)
查看dist的css文件下，就会通过gulp 输出的css文件了。
如果我们每次都修改sass文件，我们每次都要去编辑命令？
其实我们可以利用gulp 的监听方法，只要文件有修改就自动编译。
接下来我们修改gulpfilejs文件，
gulpfilejs代码：
//导入工具包 require('node_modules里对应模块')
var gulp = require('gulp'), //本地安装gulp所用到的地方
sass = require('gulp-sass');
//定义一个sass任务（自定义任务名称）
gulp.task('sass', function () {
gulp.src('src/sass/index.scss') //该任务针对的文件
.pipe(sass()) //该任务调用的模块
.pipe(gulp.dest('dist/css')); //将会在src/css下生成index.css
});
gulp.task('default',['sass']); //定义默认任务
//新增的代码。watch函数
//监听任务,src/sass目录下的所有sass文件
gulp.task('watch', ['sass'], function () {
gulp.watch('src/sass/*.scss', ['sass']);
});
运行命令行 gulp watch
现在如果修改sass文件的话，gulp就会监听，就会自动帮你编译css文件了。
好了，gulp的最基本的教程就结束了，gulp还有很多的插件，我就不一一实现了。
