hello gulp，使用gulp的第一天。

　　昨天花了一天的时间，学习了一下gulp，今天整理一下，也分享给朋友们。

　　首先当然是去gulp的官网逛一圈了：

　　http://gulpjs.com/

　　中文站地址：

　　http://www.gulpjs.com.cn/

　　里边有入门指南，如下：

　　

　　1. 全局安装 gulp：

$npm install --global gulp

　　

　　2. 在项目根目录创建package.json文件，可以手动创建，也可以用这行命令自动化完成：

　　

$ cd <yourworkspacePath>
$ npm init

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

$ npm install --save-dev gulp

　　4. 在项目根目录下创建一个名为 gulpfile.js 的文件：

var gulp = require('gulp');
gulp.task('default', function() {
　　// 将你的默认的任务代码放在这
　　console.log("hello gulp!");
});

　　5. 运行 gulp：

$ gulp

　　不过还是要有一些细节需要注意：

　　1.在windows环境下命令当然就不要加那个$符号了。

　　

　　2.网上还有一种npm install –global gulp-cli这种全局安装的方法，那么gulp和gulp-cli有什么不同呢？答案在这里：

　　http://stackoverflow.com/questions/35571679/what-does-gulp-cli-stands-for

　　3.为什么要在全局装一个gulp又要在本地项目装一个gulp呢？

　　因为方便版本控制。不同的项目可以使用不同版本的gulp而不互相影响，就是这样喽。

　　

　　等等，等等，很容易走到这里的我，还是没搞懂一件事，我们为什么要用gulp。为什么不是grunt而是gulp。还有一些相似的功能的webpack，为什么是gulp！于是，我查到了这些：

　　为什么是gulp不是grunt：

　　http://slides.com/contra/gulp#/

　　gulp跟webpack又是啥关系：

　　https://www.zhihu.com/question/37020798（感谢知乎）

　　如果这些都不是你关心的问题，你可能是想问：为啥要用gulp或者grunt？

　　借用grunt中文网的一句话：自动化。对于需要反复重复的任务，例如压缩（minification）、编译、单元测试、linting等，自动化工具可以减轻你的劳动，简化你的工作。

　　

　　好了，解决了这么多个为什么以后，我们继续gulp的学习之旅。就在刚刚，我们已经装好了gulp，那么我们下面就开始我们的工作吧。

　　假如说，我们需要给js文件进行压缩这样一件事，那么我们最原始的方式，可以把代码拷贝到压缩工具里，然后让工具压缩了，我们再拷出来放到我们的工程里。如果用gulp的话呢，我们就可以不用这么麻烦了，我们只需要做这几件事：

　　

　　1.安装gulp的js压缩插件

　　npm install –save-dev gulp uglify

　　(大家应该注意到了吧，–save-dev的意思就是把这个插件的安装信息写入到我们的package.json文件里的意思)

　　

　　2.在gulpfile.js里配置任务

var gulp = require('gulp'),
    uglify = require('gulp-uglify');
gulp.task('compile-js',function(){
    return gulp.src(<你要压缩的js文件路径>)
    .pipe(uglify())
    .pipe(gulp.dest(<你要输出的文件路径>));
});

　　写好以后，运行 gulp compile-js

　　这样看是不是很简单，哈哈。你可能觉得，这没那么简单啊，还要写代码，好麻烦。那是因为你只压缩了一个文件啊，如果让你压缩十个以上的文件，在压缩工具里拷贝来拷贝去都会弄错吧，但是如果用gulp，工作量一点都没有增加，还是这一小段代码就搞定。同样的，css，html的压缩，sass的解译都可以在这里完成，相比以前用多个工具软件切来切去方便的就不是一点半点了。

　　

　　当然啦，这里边还是有一些小坑的哦。首先是gulp的api你需要学习，要不然你怎么知道怎么建任务，怎么制定源文件和目标文件呢。

　　http://www.gulpjs.com.cn/docs/api/

　　这个小栗子就完了，不过呢，还有一些常用的功能，对应一些常用的插件，来做介绍：

　　http://www.cnblogs.com/2050/p/4198792.html

　　上边这篇文章的第四部分，插件部分讲的很好哦。

　　然后就是一些小技巧，比如说watch和changed的事：

　　http://www.tuicool.com/articles/2miAvyu

　　上边这篇文章是一篇踩坑文，感谢朋友们的分享。

　　

　　还有一个小技巧，那就是如何删掉某一个插件，就比如你某个插件装坏了，或者你不需要了，你就这样：

　　npm uninstall –save <插件全名>

　　比如我们刚才的gulp-uglify

　　npm uninstall –save gulp-uglify

　　感谢网友们的无私分享！