gulp前端自动化构建工具入门：http://www.jianshu.com/p/d003e12e2f55

gulp是基于node.js的一个构建工具（自动任务运行器），开发者可以使用它自动化工作流程。

一些常见的、重复的任务，例如：网页自动刷新、css预处理、代码检测、压缩图片、等，只需要简单的命令就能全部完成。使用它可以简化工作，提高开发效率。

gulp优点：

简洁：gulp侧重“代码优于配置”，最直观的感受，更为简单和清晰，不需要grunt一样写一堆庞大的配置文件。
高效：gulp基于node streams（流）来构建任务，避免磁盘反复读取/写入。每个任务都是单独执行，这使得它速度更快、更为纯粹。
易学：gulp核心API只有4个，简洁的API易于上手，学习过程平滑。

4个API：

gulp.src(globs,[options]) 指明源文件路径globs：路径模式匹配； option是：可选参数；

gulp.dest(path,[options]); 指明处理后的文件输出路径path：路径（一个任务可以有多个输出路径）；

gulp.task(name,[deps],fn); 注册任务 name：任务名称（通过gulp name 来执行这个任务）；

deps：可选的数组，在本任务运行中所需要依赖的其他任务（当前任务在依赖任务执行完毕后才会执行）； fn：任务函数（function 方法）；

安装

安装nodejs

创建配置信息（package.json）： npm init -y

安装：全局安装： npm install gulp -g
```
本地安装： npm install gulp --save-dev
```

注： package.json(此文件在node_modules\gulp 目录下)；-Dev：将它作为你的项目依赖添加到中devDependencies内。

插件安装

静态服务器（gulp-webserver）

网页自动刷新（gulp-livereload）

安装命令： npm install gulp-livereload gulp-webserver --save-dev

gulp任务配置

在项目目录中创建 gulpfile.js文件，用来配置和定义任务（task）

编辑gulpfile.js

// 引入gulpvar gulp = require('gulp');// 引入gulp插件// 网页自动刷新var livereload = require('gulp-livereload');// 本地服务器var webserver = require('gulp-webserver');// 注册任务gulp.task('webserver',function () {  gulp.src('./' )  // 服务器根目录  .pipe(webserver({   // 运行webserver    livereload: true,    // 启用livereload    open: true  // 服务器启动时自动打开网页  }));});// 监听任务gulp.task('watch',function() {  gulp.watch('*.html',['html'])  //监听根目录下所有HTML文件})；// 默认任务gulp.task('default',['webserver','watch']);

终端命令： gulp 自动执行

注：1、gulp插件可以通过gulp官网、npm官网或browsenpm上找到你所要的插件。2、不要在node_modules文件夹内手动删除插件，请使用命令卸载。因为手动删除的只是下载插件包，但package.json中配置信息并没有清除。3、不要直接移动gulp插件，否则优于系统层级限制，出现错误提示"文件夹名对目标文件夹可能过长，您可以缩短文件夹名并重试，或者尝试路径较短的位置"，此时把文件夹打包成RAR后在操作便可。4、npm常用命令：

安装插件： npm [-g] [--save-dev]

更新插件：npm update [-g] [--save-dev]

卸载插件： npm uninstall [-g] [--save-dev]

指定版本： npm install @VERSION [--save-dev] (其中VERSION就是你所需要的版本号)