add a partial template that returns an asset's URL and hash from webpack's manifest

still a mess but slightly more modular. also added a real 404 page.

layouts/partials/functions/debug.html

@@ -1,5 +1,5 @@
 {{ printf "<!-- htmlmin:ignore -->" | safeHTML -}}
-{{ printf "<!-- %s -->" hugo.Environment | safeHTML }}
-{{ printf "<!-- %s -->" hugo.Version | safeHTML }}
-{{ printf "<!-- /content/%s -->" .File.Path | safeHTML }}
+{{ with hugo }}{{ printf "<!-- %s -->" .Environment | safeHTML }}
+{{ printf "<!-- %s -->" .Version | safeHTML }}{{ end }}
+{{ with .File }}{{ printf "<!-- /content/%s -->" .Path | safeHTML }}{{ end }}
 {{- printf "<!-- htmlmin:ignore -->" | safeHTML }}

layouts/partials/functions/prepare-css.html

@@ -1,10 +1,8 @@
 {{/* Pull in CSS processed by Webpack */}}
 
 {{- define "__head_css" -}}
-  {{ with .Site.Data.manifest }}
-    {{ with index . "main.css" }}
-      <link rel="stylesheet" href="{{ .src | absURL }}">
-    {{ end }}
+  {{ with partial "functions/webpack" (dict "context" . "src" "main.css") }}
+    <link rel="stylesheet" href="{{ .src }}">
   {{ end }}
 
   {{/* Page-specific styles set via front matter, piped through PostCSS and inlined */}}

layouts/partials/functions/prepare-js.html

@@ -1,25 +1,23 @@
 {{/* Pull in JS processed by Webpack */}}
 
 {{- define "__head_preload" -}}
-  {{ with .Site.Data.manifest }}
-    {{ with index . "fonts/inter-subset.var.woff2" }}
-      <link rel="preload" href="{{ .src | absURL }}" as="font" type="font/woff2" crossorigin>
-    {{ end }}
-    {{ with index . "fonts/roboto-mono-subset.var.woff2" }}
-      <link rel="preload" href="{{ .src | absURL }}" as="font" type="font/woff2" crossorigin>
-    {{ end }}
-    {{ with index . "main.js" }}
-      <link rel="preload" href="{{ .src | absURL }}" as="script">
-    {{ end }}
+  {{ with partial "functions/webpack" (dict "context" . "src" "fonts/inter-subset.var.woff2") }}
+    <link rel="preload" href="{{ .src }}" as="font" type="font/woff2" crossorigin>
+  {{ end }}
+
+  {{ with partial "functions/webpack" (dict "context" . "src" "fonts/roboto-mono-subset.var.woff2") }}
+    <link rel="preload" href="{{ .src }}" as="font" type="font/woff2" crossorigin>
+  {{ end }}
+
+  {{ with partial "functions/webpack" (dict "context" . "src" "main.js") }}
+    <link rel="preload" href="{{ .src }}" as="script">
   {{ end }}
 {{- end -}}
 
 {{- define "__body_js" -}}
-  {{ with .Site.Data.manifest }}
-    {{ with index . "main.js" -}}
-      <script async defer src="{{ .src | absURL }}"></script>
-    {{ end -}}
-  {{ end -}}
+  {{ with partial "functions/webpack" (dict "context" . "src" "main.js") }}
+    <script async defer src="{{ .src }}"></script>
+  {{ end }}
 
   {{/* Detect shortcodes and append external scripts as needed once per page */}}
   {{ if .HasShortcode "gh-buttons" -}}

layouts/partials/functions/prepare-meta.html

@@ -15,10 +15,8 @@
 
 {{/* Chooses and initializes various images for use by JSON schema & open graph tags */}}
 {{/* Author image (default) */}}
-{{- with .Site.Data.manifest -}}
-  {{- with index . $.Site.Author.image -}}
-    {{- $.Scratch.Set "authorImage" (dict "Permalink" (absURL .src) "Width" 1200 "Height" 1200 "MediaType" "image/jpeg") -}}
-  {{- end -}}
+{{- with partial "functions/webpack" (dict "context" . "src" .Site.Author.image) -}}
+  {{- $.Scratch.Set "authorImage" (dict "Permalink" .src "Width" 1200 "Height" 1200 "MediaType" "image/jpeg") -}}
 {{- end -}}
 {{/* Page image (via frontmatter) */}}
 {{- with .Params.image -}}
@@ -31,9 +29,8 @@
     {{- $.Scratch.Set "pageImage" . -}}
   {{- end -}}
 {{- end -}}
+
 {{/* Site logo */}}
-{{- with .Site.Data.manifest -}}
-  {{- with index . $.Site.Params.image -}}
-    {{- $.Scratch.Set "logoImage" (dict "Permalink" (absURL .src) "Width" 2048 "Height" 2048 "MediaType" "image/png") -}}
-  {{- end -}}
+{{- with partial "functions/webpack" (dict "context" . "src" .Site.Params.image) -}}
+  {{- $.Scratch.Set "logoImage" (dict "Permalink" .src "Width" 2048 "Height" 2048 "MediaType" "image/png") -}}
 {{- end -}}

layouts/partials/functions/webpack.html

@@ -0,0 +1,13 @@
+{{/* Returns the URL and hash of an asset processed by Webpack */}}
+{{/* Usage: pass in (dict "context" . "src" "images/tiny-selfie.jpg"), returns .src = "/assets/images/tiny-selfie.jpg", .integrity = "sha384-asdfjklsemicolon" */}}
+
+{{ $src := .src }}
+{{ $data := "" }}
+
+{{ with .context.Site.Data.manifest }}
+  {{ with index . $src }}
+    {{ $data = . }}
+  {{ end }}
+{{ end }}
+
+{{ return $data }}

layouts/partials/head/favicons.html

@@ -1,15 +1,13 @@
-{{ with .Site.Data.manifest }}
-  {{- with index . "images/favicon.ico" }}
-  <link rel="icon" href="{{ .src | absURL }}">
-  {{- end }}
+{{- with partial "functions/webpack" (dict "context" . "src" "images/favicon.ico") }}
+  <link rel="icon" href="{{ .src }}">
+{{ end -}}
 
-  {{- with index . "images/favicon.svg" }}
-  <link rel="icon" href="{{ .src | absURL }}" type="image/svg+xml">
-  {{- end -}}
+{{- with partial "functions/webpack" (dict "context" . "src" "images/favicon.svg") }}
+  <link rel="icon" href="{{ .src }}" type="image/svg+xml">
+{{ end -}}
 
-  {{- with index . "images/apple-touch-icon.png" }}
-  <link rel="apple-touch-icon" href="{{ .src | absURL }}" sizes="180x180">
-  {{- end }}
-{{ end }}
+{{- with partial "functions/webpack" (dict "context" . "src" "images/apple-touch-icon.png") }}
+  <link rel="apple-touch-icon" href="{{ .src }}" sizes="180x180">
+{{ end -}}
 
 <link rel="manifest" href="{{ "site.webmanifest" | absURL }}">

layouts/partials/page/header.html

@@ -1,10 +1,8 @@
 <header>
   <nav>
     <a class="no-underline" href="{{ .Site.BaseURL }}" id="logo" rel="me author" aria-label="{{ .Site.Title }}">
-      {{ with .Site.Data.manifest }}
-        {{ with index . "images/tiny-selfie.jpg" }}
-        <img id="selfie" src="{{ .src | absURL }}" width="54" height="54" alt="Photo of Jake Jarvis">
-        {{ end }}
+      {{ with partial "functions/webpack" (dict "context" . "src" "images/tiny-selfie.jpg") }}
+        <img id="selfie" src="{{ .src }}" width="54" height="54" alt="Photo of Jake Jarvis">
       {{ end }}
 
       <span id="name">{{ .Site.Title }}</span>