分享一个gulp.js打包静态资源的gulpfile.js配置

用来打包静态资源，功能就是根据md5自动生成css和js文件名的md5后缀，并且自动替换html文件中的引用，避免浏览器缓存静态文件导致样式显示错误

var gulp = require('gulp'),
    runSequence = require('run-sequence'),
    rev = require('gulp-rev'),
    revCollector = require('gulp-rev-collector');
    clean = require('gulp-clean');

//定义css、js源文件路径
var cssSrc = 'css/*.css',
    jsSrc = 'js/*.js';
//CSS生成文件hash编码并生成 rev-manifest.json文件名对照映射
gulp.task('cleanCss', function(){
    return gulp.src('rev/css')
        .pipe(clean());
});
//CSS生成文件hash编码并生成 rev-manifest.json文件名对照映射
gulp.task('cleanJs', function(){
    return gulp.src('rev/js')
        .pipe(clean());
});
//CSS生成文件hash编码并生成 rev-manifest.json文件名对照映射
gulp.task('cleanHtml', function(){
    return gulp.src('rev/html')
        .pipe(clean());
});

//CSS生成文件hash编码并生成 rev-manifest.json文件名对照映射
gulp.task('revCss', function(){
    return gulp.src(cssSrc)
        .pipe(rev())
		.pipe(gulp.dest('rev/css'))
        .pipe(rev.manifest())
        .pipe(gulp.dest('rev/css'));
});


//js生成文件hash编码并生成 rev-manifest.json文件名对照映射
gulp.task('revJs', function(){
    return gulp.src(jsSrc)
        .pipe(rev())
		.pipe(gulp.dest('rev/js'))
        .pipe(rev.manifest())
        .pipe(gulp.dest('rev/js'));
});


//Html替换css、js文件版本
gulp.task('revHtml', function () {
    return gulp.src(['rev/**/*.json', 'html/*.html','html/**/*.html'])
        .pipe(revCollector())
        .pipe(gulp.dest('rev/html'));
});


//开发构建
gulp.task('dev', function (done) {
    condition = false;
    runSequence(
		['cleanCss'],
		['cleanJs'],
		['cleanHtml'],
        ['revCss'],
        ['revJs'],
        ['revHtml'],
        done);
});


gulp.task('default', ['dev']);