Im a little stuck here. I use https://github.com/nmrugg/gulp-hash-src for cache busting.
And there is a md5 hash added in my html file after I run "gulp css" for the first time.
The problem is that when I change something in my sass files and run it again, the md5 hash is not updated. Apparantly gulp-hash-src is not seeing any changes.
My file structure:
gulpfile.js
resources/sass/site.scss
public/index.html
public/css/site.css
This is my gulp file:
var gulp = require('gulp');
var cssnano = require('gulp-cssnano');
var sass = require('gulp-sass');
var rtlcss = require('gulp-rtlcss');
var rename = require('gulp-rename');
var hashsrc = require("gulp-hash-src");
gulp.task('buildsass', function () {
return gulp.src('resources/sass/site.scss')
.pipe( sass() )
.pipe(cssnano()) // minify
.pipe( gulp.dest('public/css') );
});
gulp.task('rtl', function () {
return gulp.src('public/css/site.css')
.pipe(rtlcss())
.pipe(rename('site-rtl.css'))
.pipe(gulp.dest('public/css'));
});
gulp.task('hashcss', function(){
return gulp.src(['./public/*.html'])
.pipe(hashsrc({build_dir: './public/css', src_path: './resources/sass', exts:['.css']}))
.pipe(gulp.dest('./public'));
});
gulp.task('css', gulp.series('buildsass', 'rtl', 'hashcss'));
And my public/index.html
<!DOCTYPE html>
<html lang="nl" dir="ltr">
<head>
<title>The title for my website</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
<meta name="description" content="">
<link rel="preload" href="css/site.css?cbh=e5d09cb29de1b454b7de682c8572f767" as="style">
<link rel="stylesheet" href="css/site.css?cbh=e5d09cb29de1b454b7de682c8572f767">
question from:
https://stackoverflow.com/questions/65861448/building-sass-and-cache-bust 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…