gulp-rev-collector实现版本管理问题

问题描述

问 题

为了应对页面文件缓存问题，这几天使用gulp-rev和gulp-rev-collector为页面css、js添加版本号，但是在使用过程中遇到一些问题：

1. 当我使用gulp监控改动文件的时候，在html文件中的版本号总是落后一个，下面图中右边的27610efafa其实是上一次生成在rev-manifest.json中的版本号，本次生成的为b264d07c16，但是没有替换到html文件中；
   

2. manifest文件能否合成为一个；

3. 如何删除旧版号的css、js文件。

代码如下：

gulp.task('css', function  () {
    gulp.src(css_src)
        .pipe(minicss())
        .pipe(rev())
        .pipe(gulp.dest('dist/css'))
        .pipe(rev.manifest())
        .pipe(gulp.dest('rev/css'))
})

gulp.task('js', function  () {
    gulp.src(js_src)
        .pipe(minijs())
        .pipe(rev())
        .pipe(gulp.dest('dist/js'))
        .pipe(rev.manifest())
        .pipe(gulp.dest('rev/js'))
})

gulp.task('version', ['css', 'js'], function  () {
    gulp.src(['rev/**/*.json', 'xx.html'])
        .pipe(revCollector({
        }))
        .pipe(gulp.dest('dist/html'))
})

gulp.task('change', function  () {
    gulp.watch(css_src, ['version'])
    gulp.watch(js_src, ['version'])
})

解决方案

我今晚使用也遇到了同样的问题，每次替换的都是上一个版本。不过找到了问题所在。

gulp.task('css', function  () {
   return gulp.src(css_src)
        .pipe(minicss())
        .pipe(rev())
        .pipe(gulp.dest('dist/css'))
        .pipe(rev.manifest())
        .pipe(gulp.dest('rev/css'))
})

gulp.task('js', function  () {
   return gulp.src(js_src)
        .pipe(minijs())
        .pipe(rev())
        .pipe(gulp.dest('dist/js'))
        .pipe(rev.manifest())
        .pipe(gulp.dest('rev/js'))
})

gulp.task('version', ['css', 'js'], function  () {
   return gulp.src(['rev/**/*.json', 'xx.html'])
        .pipe(revCollector({
        }))
        .pipe(gulp.dest('dist/html'))
})

这样修改就可以了。

这篇关于gulp-rev-collector实现版本管理问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！