gulp学习指南之CSS合并、压缩与MD5命名及路径替换

var gulp = require(‘gulp‘),
  //  uglify = require(‘gulp-uglify‘),
    concat = require(‘gulp-concat‘),
    minifycss = require(‘gulp-minify-css‘),
     rev = require(‘gulp-rev‘),
    revcollector = require(‘gulp-rev-collector‘);

npm install gulp gulp-concat gulp-minify-css gulp-rev gulp-rev-collector --save-dev

gulp.task(‘concat‘,function(){
    gulp.src(‘XingboWeb/scenemall/public/static/css/reset.css‘)  //要压缩的文件
        .pipe(minifycss(‘reset.css‘))       //压缩css
        .pipe(rev())                        //文件名加md5后缀
        .pipe(gulp.dest(‘dist/css‘))　　　　 //
        .pipe(rev.manifest())　　　　　　　　 //rev-mainfest.json文件，里面是压缩文件的信息
        .pipe(gulp.dest(‘dist/rev‘));
});

gulp.task(‘rev‘,function(){
    gulp.src([‘dist/rev/*.json‘,‘XingboWeb/scenemall/app/views/home/detail.phtml‘])   //读取压缩文件信息，和要替换目录的文件
        .pipe(revcollector({        //执行替换
            replaceReved:true,
            dirReplacements:{      
                ‘css‘:‘dist/css‘
            }
        }))
        .pipe(gulp.dest(‘XingboWeb/scenemall/app/views/home/‘))
    //    .pipe(gulp.dest(‘dist/html‘))
})