gulp静态资源构建、压缩、版本号添加

DATE=$(date +%Y%m%d%s)
# 将common*.js中urlArgs 的版本变更
sed -i "s/ttversion/$DATE/g" common*.js

#这里不要带后缀名
NEW_COMMON_JS_NAME=common_$DATE
# 将common.js更名
mv common*.js $NEW_COMMON_JS_NAME.js

# 执行gulp 压缩js和html
cd /root/xxx/xxx/gulptask
rm -r src/*
cp -r temp/front src
#执行完gulp任务后，更改所有引用了commonjs的文件里的路径名
gulp && sed -i "s/lib\/common/lib\/$NEW_COMMON_JS_NAME/g" `grep lib\/common -rl ./src/front` 

// 引入 gulp
var gulp = require(‘gulp‘); 

// 引入组件
var jshint = require(‘gulp-jshint‘),
  sass = require(‘gulp-sass‘),
  runSequence = require(‘run-sequence‘),
  concat = require(‘gulp-concat‘),
  uglify = require(‘gulp-uglify‘),
  rename = require(‘gulp-rename‘),
  revCollector = require(‘gulp-rev-collector‘),
  rev = require(‘gulp-rev‘),
  gulpif = require(‘gulp-if‘),
  condition = true,
  minifyHtml = require(‘gulp-minify-html‘),
  minifyCss = require(‘gulp-clean-css‘),
  gulpUtil = require(‘gulp-util‘);
  //var distDir = ‘/xx/xxx/front‘;
  var distDir = ‘src/front‘;

// 检查脚本
gulp.task(‘lint‘, function() {
    gulp.src(‘src/front/js/**/*.js‘)
        .pipe(jshint())
        .pipe(jshint.reporter(‘default‘));
});

// 编译Sass
gulp.task(‘sass‘, function() {
    gulp.src(‘./scss/*.scss‘)
        .pipe(sass())
        .pipe(gulp.dest(‘./css‘));
});

// 合并，压缩文件js
gulp.task(‘miniJs‘, function() {
    var lastStream = null;
   return  gulp.src(‘src/front/js/**/*.js‘)
        .pipe(uglify().on(‘error‘, gulpUtil.log))//压缩
        .pipe(rev())//计算md5
        .pipe(gulp.dest(distDir+‘/js‘))//输出压缩后的
        .pipe(rev.manifest())
        .pipe(gulp.dest(‘rev/js‘))//生成rev-mainfest.json
//        .on(‘end‘,function(){//一定要在压缩js执行完成后执行html压缩，否则会出现rev-mainfest.json还没生成，html却已经压缩完，导致js路径没替换
//         lastStream = gulp.src([‘rev/**/*.json‘,‘src/front/**/*.html‘])
//         .pipe(revCollector())
//        .pipe(gulpif(
//              condition, minifyHtml({
//                    empty: true,
//                    spare: true,
//                quotes: true
//              })
//        ))
//         .pipe(gulp.dest(distDir));
//         })
});

gulp.task(‘miniHtml‘, function () {
  return gulp.src([‘rev/**/*.json‘, ‘src/front/**/*.html‘])//读取rev目录下的版本映射文件并替换html中的路径
    .pipe(revCollector())
    .pipe(gulpif(
      condition, minifyHtml({
        empty: true,
        spare: true,
        quotes: true
      })//压缩
    ))
    .pipe(gulp.dest(distDir));//输出
});

//压缩CSS/生成版本号
gulp.task(‘miniCss‘, function(){
  return gulp.src(‘src/front/themes/**/*.css‘)
      .pipe(gulpif(
            condition, minifyCss({
                    compatibility: ‘ie7‘
                          })
                              ))
                                  .pipe(rev())
                                      .pipe(gulp.dest(distDir+‘/themes‘))
                                          .pipe(rev.manifest())
                                              .pipe(gulp.dest(‘./rev/css‘));//生成.json文件
                                              });
//图片处理
gulp.task(‘revImg‘, function(){
  return gulp.src(‘src/front/themes/**/*.{png,jpg,jpeg,gif,ico}‘)//知识点：匹配多个后缀
    .pipe(rev())
    .pipe(gulp.dest(distDir+‘/themes‘))
    .pipe(rev.manifest())
    .pipe(gulp.dest(‘./rev/img‘));
});

// 默认任务,使用runSequence保证任务按顺序执行，miniJs和miniCss是并行执行的，miniHtml是在前两个任务执行完后再执行
gulp.task(‘default‘, function (done) {
  runSequence(
     [‘miniJs‘,‘miniCss‘],
     ‘miniHtml‘,
  done);
})