gulp使用gulp-rev为文件添加时间戳,但是使用gulp-rev-collector替换时失败,是不是gulpfile中配置错误呢?
代码如下:
var gulp = require('gulp');
var sass = require('gulp-sass');//编译sass
var cssMin = require('gulp-minify-css');//压缩css
var imageMin = require('gulp-imagemin');//压缩图片
var rev = require('gulp-rev');//MD5
var htmlmin = require('gulp-htmlmin');//压缩html
var revCollector = require('gulp-rev-collector');//替换时间戳
gulp.task('sass',function(){
gulp.src('./SASS/*.scss')
.pipe(sass())
.pipe(cssMin())
.pipe(rev())
.pipe(gulp.dest('dist/stylesheet'))
.pipe( rev.manifest() )
.pipe( gulp.dest( 'rev/stylesheet' ) );
});
gulp.task('imagemin', function () {
gulp.src('./images/*.{png,jpg,gif,ico}')
.pipe(imageMin({
optimizationLevel: 5,
progressive: true,
interlaced: true,
multipass: true
}))
.pipe(rev())
.pipe(gulp.dest('dist/images'))
.pipe(rev.manifest())
.pipe(gulp.dest('./rev/images'));
});
gulp.task('revCollector', function () {
gulp.src(['rev/**/*.json', './*.html'])
.pipe( revCollector())
.pipe(htmlmin())
.pipe( gulp.dest('dist/'));
});
gulp.task('revCollectorCss', function () {
gulp.src(['rev/**/*.json', './dist/stylesheet/*.css'])
.pipe(revCollector())
.pipe(gulp.dest('./dist/stylesheet'));
});
gulp.task('auto', function () {
gulp.watch('./SASS/*.scss', ['sass'])
});
gulp.task('default', ['sass', 'auto','imagemin','revCollectorCss','revCollector']);
目录结构如下:
希望在当前目录生成dist:dist中有images和stylesheet文件夹,以及压缩过的index.html
运行gulp后,MD5添加没有问题,能生成rev下json,压缩都没有问题,但是不进行替换
请各路大神帮我看看gulp哪里写错了
When I read the documentation carefully, I found that there was a problem with my code, which has been solved now. The main reference is here http://www.ydcss.com/archives...
The main problem is the dependency of each task. It is very likely that the json file of the manifest cannot be found when the task is executed. Now add it After the dependency, replace ok. One thing that needs to be reminded is that because the call is dependent, it is best to take the return value of return. This way it is easier to use