0

I've been scratching head to bold due to this

I have set hash to name of all html files using gulp-rev and they are all matched in manifest file . I use gulp-rev-collector to match all updated hash as well .

I'm sure if any of content of client side file changed , I get new hashed file name after gulp build but the Browser doesn't update and request new file , It still uses old cache file until I clean cache and hard reload . here is simplified codes below:

gulp-rev

gulp.task('minify:html', function () {
var options = {
  removeComments: true,
  collapseWhitespace: true,
  collapseBooleanAttributes: false,
  removeEmptyAttributes: false,
  removeScriptTypeAttributes: true,
  removeStyleLinkTypeAttributes: true,
  minifyJS: true,
  minifyCSS: true
};
return gulp
.src([paths.src.html, '!./node_modules/**/*.html', '!./templates/**/*.html', '!./index.html', 
'!./dist/**/*.html']) //  views  
.pipe(htmlmin(options))
.pipe(rev())
.pipe(gulp.dest('./dist'))
.pipe(rev.manifest())
.pipe(gulp.dest('./dist/rev/html'))

})

revision dist views

gulp.task('revDistViews', function () {
  return gulp.src(['./dist/rev/**/*.json', './dist/views/*.html'])
    .pipe( revCollector({
      replaceReved: true,
    }) )
    .pipe( gulp.dest('./dist/views') );
})

gulp build

gulp.task('build', function (callback) {
runSequence('clean:dist', 'clean:views', 'scss', 'concat:js', 'file:include', 'copy:lib', 
'copy:locales', 'copy:img', 'minify:html', 'minify:index', 'minify:scripts', 
'revImages','minify:css', 'rev', 'revDistViews','revScripts', callback)
})

I can see hash changed after built in /dist folder . but the Chrome still use old Cache instead of new file

Is there any solution I could use by client side ?

Note: none of cache policy set in response header

FVBn
  • 97
  • 11

0 Answers0