Create automation for easier to read CSP diffs

Author: dhogan8

README.md

@@ -101,6 +101,38 @@ hugo server
 npm run lint
 ```
 
+#### HTTP Headers Configuration
+
+The `static/_headers` file is automatically generated from
+`static/_headers.config.ts`. **Do not edit `static/_headers` directly** - your
+changes will be overwritten.
+
+##### Making Changes to Headers
+
+1. Edit `static/_headers.config.ts` (the source of truth with readable format
+   and TypeScript type safety)
+2. Generate the headers file:
+   ```sh
+   npm run build:headers
+   ```
+3. Commit both files - a git pre-commit hook will automatically regenerate
+   `static/_headers` when you modify `_headers.config.ts`
+
+##### Automatic Synchronization
+
+The files stay in sync automatically through:
+
+- **Pre-commit hook** - Regenerates `_headers` when `_headers.config.ts` changes
+- **Build process** - `build.sh` regenerates before deployment
+- **Manual generation** - Run `npm run build:headers` anytime
+
+The TypeScript config format provides:
+
+- Readable multi-line arrays for CSP directives
+- Native TypeScript type safety and IDE support
+- Easy-to-review diffs in pull requests
+- Zero dependencies for parsing
+
 ## Writing Blog Posts
 
 Blog posts are written using

build.sh

@@ -8,4 +8,7 @@ if [[ "${BUILD_ENV:-}" == "preview" ]]; then
   extra_args+=("--buildFuture")
 fi
 
+# Generate _headers file from TypeScript configuration
+npx tsx scripts/generate-headers.ts
+
 hugo --gc --minify -b "$CF_PAGES_URL" "${extra_args[@]}"

git/hooks/pre-commit

@@ -24,4 +24,20 @@ function timed_run() {
     fi
 }
 
+# Regenerate static/_headers from _headers.config.ts if it changed
+if git diff --cached --name-only | grep -q "static/_headers.config.ts"; then
+  echo "Detected changes to static/_headers.config.ts, regenerating static/_headers..."
+  npx tsx scripts/generate-headers.ts
+  git add static/_headers
+  echo "✅ Updated static/_headers and added to commit"
+fi
+
+# Also regenerate if the generator script itself changed
+if git diff --cached --name-only | grep -q "scripts/generate-headers.ts"; then
+  echo "Detected changes to generator script, regenerating static/_headers..."
+  npx tsx scripts/generate-headers.ts
+  git add static/_headers
+  echo "✅ Updated static/_headers and added to commit"
+fi
+
 timed_run "local/precious lint" "local/precious lint --staged"