Fingerprint CSS and JS assets for cache busting (#424)

twbs · Mar 11, 2024 · effbd9f · effbd9f
1 parent 5909636
commit effbd9f
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 8 deletions.
diff --git a/hugo.yml b/hugo.yml
@@ -76,7 +76,7 @@ module:
     - source:           node_modules/bootstrap/scss
       target:           assets/scss/bootstrap
     - source:           node_modules/bootstrap/dist/js/bootstrap.bundle.min.js
-      target:           static/assets/js/vendor/bootstrap.bundle.min.js
+      target:           assets/js/bootstrap.bundle.min.js
 
 params:
   docs_version:         "5.3"

diff --git a/src/layouts/partials/head.html b/src/layouts/partials/head.html
@@ -16,7 +16,7 @@
 <meta name="robots" content="{{ . }}">
 {{- end }}
 
-{{- $colorModeJS := resources.Get "js/color-modes.js" | resources.Copy "/assets/js/color-modes.js" -}}
+{{- $colorModeJS := resources.Get "js/color-modes.js" | fingerprint | resources.Copy "/assets/js/color-modes.js" -}}
 <script src="{{ $colorModeJS.Permalink | relURL }}"></script>
 
 {{ partial "stylesheet" . }}

diff --git a/src/layouts/partials/scripts.html b/src/layouts/partials/scripts.html
@@ -1,16 +1,17 @@
-<script async src="/assets/js/vendor/bootstrap.bundle.min.js"></script>
-
 {{- $esbuildOptions := dict "target" "es2019" -}}
 
 {{- if hugo.IsProduction -}}
   {{- $esbuildOptions = merge $esbuildOptions (dict "minify" "true") -}}
 {{- end -}}
 
-{{- $lazyload := resources.Get "js/lazyload.js" | js.Build $esbuildOptions | resources.Copy "/assets/js/lazyload.js" -}}
-{{- $application := resources.Get "js/application.js" | js.Build $esbuildOptions | resources.Copy "/assets/js/application.js" -}}
+{{- $bootstrapJs := resources.Get "/js/bootstrap.bundle.min.js" | fingerprint | resources.Copy "/assets/js/vendor/bootstrap.bundle.min.js" -}}
+<script async src="{{ $bootstrapJs.Permalink | relURL }}"></script>
+
+{{- $application := resources.Get "js/application.js" | js.Build $esbuildOptions | fingerprint | resources.Copy "/assets/js/application.js" -}}
+{{- $lazyload := resources.Get "js/lazyload.js" | js.Build $esbuildOptions | fingerprint | resources.Copy "/assets/js/lazyload.js" -}}
 
-<script async src="{{ $lazyload.Permalink | relURL }}"></script>
 <script async src="{{ $application.Permalink | relURL }}"></script>
+<script async src="{{ $lazyload.Permalink | relURL }}"></script>
 
 {{ range .Page.Params.extra_js -}}
 <script{{ with .async }} async{{ end }} src="{{ .src }}"{{ with .integrity }} {{ printf "integrity=%q" . | safeHTMLAttr }} crossorigin="anonymous"{{ end }}></script>

diff --git a/src/layouts/partials/stylesheet.html b/src/layouts/partials/stylesheet.html
@@ -5,6 +5,6 @@
   {{- $sassOptions = merge $sassOptions (dict "outputStyle" "compressed") -}}
 {{- end -}}
 
-{{- $style := resources.Get "scss/style.scss" | toCSS $sassOptions | postCSS $postcssOptions -}}
+{{- $style := resources.Get "scss/style.scss" | toCSS $sassOptions | postCSS $postcssOptions | fingerprint -}}
 
 <link href="{{ $style.Permalink | relURL }}" rel="stylesheet">