gulp

传统的项目开发，就是使用HTML+CSS+JavaScript这些简单的技术构建网页应用程序，但这种简单的开发方式有着大量重复的操作，如：编写样式并在浏览器中测试代码...。我们要提高效率，就必须减少重复的工作，gulp是当下最流行的自动化工具，可以自动化完成我们开发过程中大量的重复工作。

为什么要用自动化构建工具？主要是用来自动完成一系列重复的操作，如：

       1）编译：

              less-> css

              sass->css

    coffeescript->js

       2）合并: css, js

       3）压缩 ：css, js, html

       4）优化：图片优化

       ......

   官网：http://gulpjs.com/

   中文网：http://www.gulpjs.com.cn/

1. 全局安装 gulp：

npminstall --global gulp

说明：全局安装gulp目的是为了通过它执行gulp任务

2. 本地安装gulp：

作为项目的开发依赖（devDependencies）安装：

npminstall --save-dev gulp

PS:

1）本地安装gulp是为了调用gulp插件的功能，

2）--save-dev 保存配置信息至package.json 的 devDependencies 节点

3）这步操作前先新建package.json文件（npminit）

4）这步完成后就可以安装各种gulp插件了

3. 创建gulpfile.js文件

在项目根目录下创建一个名为gulpfile.js 的文件（重要）

说明：gulpfile.js是gulp项目的配置文件，是位于项目根目录的普通js文件，内容如下：

var gulp =require('gulp');

gulp.task('default',function() {

  //将你的默认的任务代码放在这

});

4. 运行 gulp：

格式：gulp <任务名称>

如果不写任务名称，则自动运行default任务（如果有）

 

gulp工作流程

1）选通过 gulp.src()方法获取到想要处理的文件，并返回文件流

2）然后文件流通过 pipe 方法导入到gulp 的插件中

3）经过插件处理后的文件流再通过pipe方法导入到gulp.dest() 方法中

4）最后通过gulp.dest()方法把流中的内容写入到文件中

PS：文件流=>文件在内存中的状态