贡献gulp插件两枚

最近将项目的构建工具换成了gulp.js，实在受不了ant了，也没打算考虑grunt。具体为啥选gulp，最主要的原因还是讨厌写配置。

编写构建脚本过程中发现有些功能都没有现成插件可用，干脆自己写了得了。

我们做前端项目可能会面对如下两种场景：

1. 有些页面（比如网站登录页）脚本并不多，为了减少请求不会引用外部脚本，而改用行间脚本。但这样有个问题，行间脚本没办法压缩。
2. 样式文件中引用的图片地址为了防止缓存，需要加上版本号。手工改实在是太low了，另外，普通的将日期作为版本号的方式也不妥当。

针对上面两种场景，我写了两个插件来实现对应功能，分别是gulp-minify-inline-scripts和gulp-make-css-url-version。用法很简单：

gulp-minify-inline-scripts

var minifyInline = require('gulp-minify-inline-scripts');

gulp.task('minify', function() {
  gulp.src('html/*.html')
    .pipe(minifyInline())
    .pipe(gulp.dest('dist'))
});

gulp-make-css-url-version

var makeUrlVer = require('gulp-make-css-url-version');

gulp.task('stylesheets', function() {
  gulp.src('css/*.css')
    .pipe(makeUrlVer())
    .pipe(gulp.dest('dist'))
});

gulp-make-css-url-version默认是取图片文件的md5值作为版本号。

其实编写gulp.js插件是件十分容易的事，明确插件的功能，按照下面的模板，分分钟就可以来上一个。

var gutil = require('gulp-util');
var through = require('through2');

module.exports = function (options) {
    return through.obj(function (file, enc, cb) {
        options = options || {};
        var self = this;

        if (file.isNull()) {
            this.push(file);
            return cb();
        }

        if (file.isStream()) {
            this.emit('error', new gutil.PluginError(PLUGIN_NAME, 'Streaming not supported'));
            return cb();
        }

        var html = file.contents.toString();

        /**  replace html func
        */

        file.contents = new Buffer(html);
        self.push(file);
        cb();

    });
};