gulp插件推荐，无敌好用

最近在折腾gulp这方面的东西，其中发现了很多非常好用的插件，现在给大家安利一下：

P.S. : 如果您需要查看这些插件的具体用法，我建议您进入到  www.npmjs.com  中，查找该插件并学习使用。

或者你也可以联系我，我会尽我所能帮你解答哦~

1、gulp-compass。

这个插件可以帮助我们使用compass对sass文件进行编译，当然前提是你有安装ruby并搭建好sass和compass的环境。

2、gulp-autoprefixer。

这个插件可以帮助我们对某些CSS属性进行前缀的插入，非常好用。但大家要注意browsers这一项，里面应该配置你当前所需要兼容的浏览器环境。

推荐的browser属性安排为：

browsers: [
	'last 2 versions',
	'safari 5',
	'ie 8',
	'ie 9',
	'opera 12.1',
	'ios 6',
	'android 4'
]

以上会将比较主流的浏览器都兼容了。

3、gulp-data。

这一个插件是我在使用ejs模板的时候偶然发现的。当时我正苦恼于如何将数据打入到ejs中，以便我通过gulp创造出属于我的html。它绝对是一个利器。

只是大家需要安排好文件的路径，这样gulp-data就会按照每一个文件名来将制定的数据文件打入进去了。

以下是我关于ejs的gulp配置，其中还利用了gulp-cached。

var gulp 	= require('gulp');
var config 	= require('../config.js');
var cache 	= require('gulp-cached');
var path 	= require('path');
var data 	= require('gulp-data');
var ejs 	= require('gulp-ejs');

gulp.task('ejs', function () {
	return gulp.src( config.ejs.src )
		.pipe( cache( 'ejs' ) )
		.pipe(data(function(file) {
	    	return require(path.join(path.dirname(file.path), 'ejs-data/', path.basename(file.path, '.ejs') + '.json'));
	    }))
		.pipe( ejs() )
		.pipe( gulp.dest(config.ejs.dest) );
})

4、gulp-cached。

这个插件主要是通过缓存的形式，将未修改的文件不放到管道中。因为文件不在管道中，所以不会被进行gulp的下一步处理。通过它，我们可以节省很多的浪费资源，真正的做到只对需要的文件进行处理。

用法非常简单，建议大家去npnjs.com中查找这个插件并寻找相应的用法。

5、gulp-changed。

这个插件主要是不让未经修改的文件进入管道数据流中。

它可以用在哪里呢？最常用的地方就是——图片，例如png,jpg等压缩。当我们的工作目录中存在大量的需要压缩的图片，但是他们是已经被压缩了的，这个时候我们就可以通过使用它来达到极大的资源节省。

好比我的一个项目中，每压缩一次png图片，都要跑10s。现在用了gulp-changed，我只要33ms就能跑完了。提升空间极度惊人。

注意：这个插件，以我的观察，应该是通过比较文件名而进行下一步处理的。形如png等文件，因为输入输出两个过程都不会影响文件名，所以可以用这个插件。但形如sass等会将文件名或者后缀名改掉的文件，则无法使用该插件。

6、gulp-remember。

这个插件与gulp-cached配合使用。加入你在一个工作流之中，需要对每一个文件进行一点处理，例如为每一个js文件添加一些注释信息等，newer就可以让这个js文件在进行完处理之后再重新放入到cached中，而不进入下一步的管道。

7、gulp-newer。

这个插件只会将当前目录下面的新文件放入到工作流中，如果文件已经在输出目录中存在，则不会进入到管道中。

注意：这个插件，以我的观察，应该是通过比较文件名而进行下一步处理的。形如png等文件，因为输入输出两个过程都不会影响文件名，所以可以用这个插件。但形如sass等会将文件名或者后缀名改掉的文件，则无法使用该插件。

8、gulp-sequence。

有时候我们会遇到这样的情况：当我使用gulp.run()运行一串任务的时候，因为gulp的任务是并发执行的，很多时候其他的任务都没有完成，然后这个已经完成了。就好比我需要使用compass将sass文件编译出来，同时他们会生成雪碧图，而后我才跑png压缩的任务。这个时候，我们就要用到gulp-sequence了。

gulp-sequence与gulp-run-sequence的用法大同小异，其实也跟gulp.run()基本一致，只不过在括号中，一个参数代表一组任务，这一组任务执行完了，才会执行下一组任务。同一组任务中，可以允许并发执行。

形如以下的代码：

sequence('sass', ['png', 'ejs'])

也就是：我先执行“sass'任务，然后再同时并发执行'png'和'ejs'。

————————————————————————————————————————————————

gulp中好的插件非常的多，我还会陆续补充哦！

有什么好的推荐或者建议，也请与我联系，或者在下方留言。