說明：支援配置config輸入目錄 以及輸出目錄
支援hash css js image（有動態更換本地圖片路徑時不建議使用hash）
支援合併css js 目前暫不支援合併後js路徑自動替換
支援自動替換html 引用檔案路徑
...*min.* 不參與壓縮&&hash

gulpfile.js程式碼如下：

var gulp         = require('gulp'),
    gulpIgnore   = require('gulp-ignore'),
    order        = require('gulp-order'),
    gulpif       = require
 
('gulp-if'),
    clean        = require('gulp-clean'),
    uglify       = require('gulp-uglify'),
    concat       = require('gulp-concat'),
    rev          = require('gulp-rev'),
    cssmin       = require('gulp-mini-css'),
    imagemin     = require('gulp-imagemin'),
    htmlreplace  = require('gulp-html-replace'
 
),
    minifyHTML   = require('gulp-minify-html'),
    htmlmin      = require('gulp-htmlmin'),
    revCollector = require("gulp-rev-collector"),
    replace      = require('gulp-replace'),
    rename      = require('gulp-rename'),
    pump         = require('pump'),
    sequence     = require('run-sequence'
 
);
var config = {
    src: "redbag", // 輸入目錄
    src_css: 'css', // 輸入css所在資料夾
    src_js: 'js', // 輸入js所在資料夾
    dist: "dist", // 輸出目錄
    dist_css: 'css', // 輸出css檔案存放資料夾 為空則在根目錄下
    dist_js: 'js', // 輸出js檔案存放資料夾 為空則在根目錄下
    css_min_name: 'main.min.css', // 壓縮後js
    js_min_name: 'main.min.js', // 壓縮後css
    css_sort: ['common.css','main.css'], // 當前css引用順序 後面合併會依照此排序
    // 當前js引用順序 後面合併會依照此排序
    js_sort: ['zepto.min.js', 'track.js', 'sa.hb.js', 'common.js', 'main.js', 'rule.js']
}

var addMinFile = function (arr,folder) {
    for(var i=0;i<arr.length;i++){
       arr[i] = config.src+'/'+folder+'/'+arr[i];
    }
    return arr;
}
config.js_sort = addMinFile(config.js_sort,config.src_js)
config.js_sort.push('!'+config.src+'/**/*min.js')
config.css_sort = addMinFile(config.css_sort,config.src_css)
config.css_sort.push('!'+config.src+'/**/*min.css')

//
/**
 * 清理目標目錄
 */
gulp.task('clean', function(cb) {
    pump([
        gulp.src(config.dist),
        clean()
    ], cb)
})

/**
 * 執行JS壓縮
 */
gulp.task('minify:js', function () {
    gulp.src(config.js_sort)
        // .pipe(order(addMinFile(config.js_sort,'js'), {base:'./'}))
        .pipe(concat(config.js_min_name))//合併 config.js_min_name
        .pipe(uglify())//壓縮
        // .pipe(rename())
        .pipe(rev())
        .pipe(gulp.dest(config.dist+'/'+config.dist_js))
        .pipe(rev.manifest())
        .pipe(gulp.dest(config.dist+'/'+config.dist_js))
});

// 將未參與壓縮的檔案複製到dist/js下
gulp.task('copyJs', function(){
    return gulp.src([config.src+'/**/*.min.js'])
        .pipe(gulp.dest(config.dist));
    }
);

//壓縮css
gulp.task('cssmin:css', function(){
    return gulp.src(config.css_sort)
        .pipe(concat(config.css_min_name))
        .pipe(cssmin())
        // .pipe(rev())
        // .pipe(gulp.dest(config.dist))
        // .pipe(rev.manifest())
        .pipe(gulp.dest(config.dist+'/'+config.dist_css));
});


// 將未參與壓縮的檔案複製到dist/CSS下
gulp.task('copyCss', function(){
    return gulp.src([config.src+'/**/*.min.css'])
        .pipe(gulp.dest(config.dist));
    }
);

//壓縮圖片---無動態更改圖片路徑 可以使用hash
// gulp.task('imagemin:image', function(){
//     return gulp.src(config.src+'/**/img/**/*')
//         .pipe(imagemin())
//         .pipe(rev())
//         .pipe(gulp.dest(config.dist))
//         .pipe(rev.manifest())
//         .pipe(gulp.dest(config.dist+'/img'));
// });

//壓縮圖片---有動態更改圖片路徑
gulp.task('imagemin:image', function(){
    return gulp.src(config.src+'/**/img/**/*')
        .pipe(gulp.dest(config.dist))
});

gulp.task('html-replace',function() {
    console.log(config.dist+'/'+config.dist_js+'/*.json')
  console.log(gulp.src(config.dist+'/'+config.dist_js+'/*.json'));
  return gulp.src(config.src+'/*.html')
    .pipe(htmlreplace({
        // 'js': 'js/'+config.js_min_name,
        'js': config.dist_js+'/**-**.min.js',
        // 'js': config.dist_js + gulp.src([config.dist+'/**/*.json']).config.js_min_name,
        'css': 'css/'+config.css_min_name
    }))
    .pipe(gulp.dest(config.dist));
});

gulp.task('htmlmin:html', function(){
    return gulp.src(config.src+'/*.html')
           .pipe(htmlmin({collaspseWhiteSpace:true}))
           .pipe(gulp.dest(config.dist));
});

//Html替換css、js檔案版本
gulp.task('rev-collector', function () {
    return gulp.src([config.dist+'/**/*.json', config.dist+'/**/*.html'])
    .pipe(revCollector({
        replaceReved: true
    }))
    .pipe(gulp.dest(config.dist));
});


// 將其他檔案or資料夾移動到目標目錄
gulp.task('mvNotDealAsset', function () {
    return gulp.src([config.src+'/.*','!'+config.src+'**/*.css', '!'+config.src+'**/*.js'])
    .pipe(gulp.dest(config.dist));
});

/**
/**
 * 監聽JS檔案變改，即時呼叫任務執行JS增量打包
 */
 gulp.task('watch', function () {
    gulp.watch(config.src+'/**/*.js',['minjs']);//監聽src/css/下的全部.js檔案，若有改動則執行名為'minjs'任務
});

 /**
 * 監聽CSS檔案變改，即時呼叫任務執行JS增量打包
 */
 gulp.task('watch', function () {
    gulp.watch(config.src+'/**/*.css',['mincss']);//監聽src/css/下的全部.js檔案，若有改動則執行名為'mincss'任務
});

/**
 * 開始執行
 */
gulp.task('default', function(cb) {
    sequence('clean', 'minify:js', 'copyJs', 'cssmin:css','copyCss', 'imagemin:image', 'rev-collector','html-replace', 'watch', cb);
});

package.json檔案配置如下：

{
  "name": "demo",
  "version": "3.5.6",
  "description": "gulp-demo",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "gulp": "gulp gulpfile.js"
  },
  "author": "---",
  "license": "ISC",
  "devDependencies": {
    "gulp": "^3.9.1",
    "gulp-clean": "^0.3.2",
    "gulp-concat": "^2.6.1",
    "gulp-html-replace": "^1.6.2",
    "gulp-minify": "0.0.15",
    "gulp-minify-css": "^1.2.4",
    "gulp-rename": "^1.4.0",
    "gulp-replace": "^0.5.4",
    "gulp-rev": "^7.1.2",
    "gulp-rev-collector": "^1.1.1",
    "gulp-sass": "^3.1.0",
    "gulp-sequence": "^0.4.6",
    "gulp-uglify": "^2.1.2"
  },
  "dependencies": {
    "gulp-changed": "^3.2.0",
    "gulp-htmlmin": "^4.0.0",
    "gulp-if": "^2.0.2",
    "gulp-ignore": "^2.0.2",
    "gulp-imagemin": "^4.1.0",
    "gulp-mini-css": "0.0.3",
    "gulp-minify-html": "^1.0.6",
    "gulp-order": "^1.1.1",
    "gulp-sourcemaps": "^2.6.4",
    "pump": "^3.0.0",
    "run-sequence": "^2.2.1"
  }
}

打包命令： 輸入gulp 然後回車