fix(docker): bun cache stays out of the runtime image, env= on a cache mount sets nothing

README.md

@@ -1,8 +1,8 @@
 # frontend-svelte
 
-Copier template for a SvelteKit frontend, either as a `frontend/` part next to other parts or alone at the root of the project (`layout`): SvelteKit on Bun with Tailwind v4, ultracite (biome) and optional shadcn-svelte, served by a Bun server with SSR, as a static SPA behind `serve.ts`, or as a static SPA that the backend api serves from `frontend/build`.
+Copier template for a SvelteKit frontend, either as a `frontend/` part next to other parts or alone at the root of the project (`layout`): SvelteKit on Bun with Tailwind v4, ultracite (biome) or ESLint + Prettier (`linter`) and optional shadcn-svelte, served by a Bun server with SSR, as a static SPA behind `serve.ts`, or as a static SPA that the backend api serves from `frontend/build`.
 
-Ships `frontend/docker-compose.yml` with root-relative paths and profiles per service, `docker-compose.override.yml.example` (the `caddy` network aliases, copied by `make env`), a `Makefile` with `fmt`, `check`, `build` and `dev`, `.env.example`, `CLAUDE.md`, `.claude/rules` for Svelte and ultracite, the Svelte MCP server and `.impeccable/` scaffolding. Applied on top of the `infra` template, `layout: parts` or `layout: single` respectively.
+Ships `frontend/docker-compose.yml` with root-relative paths and profiles per service, `docker-compose.override.yml.example` (the `caddy` network aliases, copied by `make env`), a `Makefile` with `fmt`, `check`, `build` and `dev`, `.env.example`, `CLAUDE.md`, `.claude/rules` for Svelte (and ultracite with biome). The image is built in stages: `.env` is in the build context, since `$env/static/*` are inlined at build time, and stays in the builder stage; the runtime image gets `build/` and production dependencies only. The Svelte MCP server comes from `infra`. Applied on top of the `infra` template, `layout: parts` or `layout: single` respectively.
 
 ```sh
 copier copy --trust -d project_name="My Thing" -d serve=bun <this-repo> <dest>

copier.yml

@@ -37,10 +37,13 @@ ui_library:
     shadcn-svelte: shadcn
   default: none
 
-include_impeccable:
+linter:
-  type: bool
+  type: str
-  help: .impeccable/ scaffolding for the impeccable skill
+  help: Linter and formatter
-  default: true
+  choices:
+    Biome with the ultracite preset: biome
+    ESLint + Prettier (the sv create setup): eslint
+  default: biome
 
 install_deps:
   type: bool
@@ -63,4 +66,6 @@ prefix:
   default: "{{ 'frontend/' if layout == 'part' else '' }}"
 
 _tasks:
-  - "{% if _copier_operation == 'copy' and install_deps %}sh -c 'cd {{ part_dir }} && bun install'{% else %}true{% endif %}"
+  # prettier-plugin-tailwindcss and biome sort classes differently, the
+  # sources follow biome: an eslint project is formatted once, right away.
+  - "{% if _copier_operation == 'copy' and install_deps %}sh -c 'cd {{ part_dir }} && bun install{% if linter == 'eslint' %} && bun run fix{% endif %}'{% else %}true{% endif %}"

template/.claude/settings.json.jinja

@@ -4,7 +4,7 @@
       {
         "hooks": [
           {
-            "command": "{% if layout == 'part' %}cd frontend && {% endif %}bun run fix --skip=correctness/noUnusedImports",
+            "command": "{% if layout == 'part' %}cd frontend && {% endif %}bun run fix{% if linter == 'biome' %} --skip=correctness/noUnusedImports{% endif %}",
             "type": "command"
           }
         ],

template/.mcp.json

@@ -1,8 +0,0 @@
-{
-  "mcpServers": {
-    "svelte": {
-      "type": "http",
-      "url": "https://mcp.svelte.dev/mcp"
-    }
-  }
-}

template/{% if include_impeccable %}.impeccable{% endif %}/.gitignore

@@ -1,3 +0,0 @@
-config.local.json
-hook.cache.json
-hook.pending.json

template/{{ part_dir }}/.dockerignore

@@ -1,5 +1,7 @@
 node_modules
 .svelte-kit
 build
-.env
+# .env goes into the build: $env/static/public (and static/private) are
+# inlined at build time from it. It stays in the builder stage, the runtime
+# image gets build/ only. Local overrides (.env.local and the like) stay out.
 .env.*

template/{{ part_dir }}/Makefile.jinja

@@ -1,6 +1,9 @@
-COMPOSE := docker compose{% if layout == 'part' %} --project-directory ..{% endif %}
+COMPOSE := {% if layout == 'part' %}cd .. && {% endif %}docker compose
+{% if serve != 'api' %}IMAGE := {{ project_slug | replace('_', '-') }}/frontend
+{% endif %}changed = ! git diff --quiet $(1) -- $(2) 2>/dev/null
+stamp = { git update-ref $(1) HEAD 2>/dev/null || true; }
 
-.PHONY: {% if layout == 'root' %}env recreate rebuild restart logs down {% endif %}fmt check build dev
+.PHONY: {% if layout == 'root' %}env recreate rebuild restart logs down deploy {% endif %}fmt check build pre-deploy post-deploy dev
 
 fmt:
 	bun run fix
@@ -13,12 +16,27 @@ build:
 {% if serve == 'api' %}	$(COMPOSE) run --rm frontend-dev sh -c "bun install && bun run build"
 {% else %}	$(COMPOSE) build frontend
 {% endif %}
+pre-deploy:
+	@if $(call changed,refs/deploy/frontend,.) || {% if serve == 'api' %}! test -d build{% else %}! docker image inspect $(IMAGE) >/dev/null 2>&1{% endif %}; then \
+		$(MAKE) build && $(call stamp,refs/deploy/frontend); \
+	fi
+
+post-deploy:
+	@:
+
 dev:
 	bun run dev
 {% if layout == 'root' %}
 env:
-	@test -f .env || cp .env.example .env
+	@fresh=; test -f .env || { cp .env.example .env; fresh=1; }; \
-	@test -f docker-compose.override.yml || cp docker-compose.override.yml.example docker-compose.override.yml
+	if ! test -f docker-compose.override.yml; then \
+		cp docker-compose.override.yml.example docker-compose.override.yml; \
+		for port in $$(sed -n 's/.*127\.0\.0\.1:\([0-9]*\):.*/\1/p' docker-compose.override.yml | sort -u); do \
+			random=$$((20000 + $$(od -An -N2 -tu2 /dev/urandom) % 40000)); \
+			sed "s/127\.0\.0\.1:$$port:/127.0.0.1:$$random:/" docker-compose.override.yml > docker-compose.override.yml.tmp && mv docker-compose.override.yml.tmp docker-compose.override.yml; \
+			test -z "$$fresh" || { sed "s|localhost:$$port/|localhost:$$random/|" .env > .env.tmp && mv .env.tmp .env; }; \
+		done; \
+	fi
 
 recreate:
 	$(COMPOSE) up -d --force-recreate
@@ -34,4 +52,8 @@ logs:
 
 down:
 	$(COMPOSE) down
+
+deploy: pre-deploy
+	$(COMPOSE) up -d
+	$(MAKE) post-deploy
 {% endif %}

template/{{ part_dir }}/docker-compose.override.yml.example.jinja

@@ -6,6 +6,8 @@ services:
       caddy:
         aliases:
           - {{ dash }}-frontend
+#    ports:
+#      - "127.0.0.1:3000:3000"
 
 {% endif %}  frontend-dev:
     networks:
@@ -13,6 +15,8 @@ services:
       caddy:
         aliases:
           - {{ dash }}-frontend
+#    ports:
+#      - "127.0.0.1:3000:3000"
 
 networks:
   caddy:

template/{{ part_dir }}/docker-compose.yml.jinja

@@ -1,7 +1,7 @@
 services:
 {% if serve != 'api' %}  frontend:
     build: {{ part_dir }}
-    image: {{ project_slug }}/frontend
+    image: {{ project_slug | replace('_', '-') }}/frontend
     profiles: [frontend, services]
     restart: unless-stopped
     env_file:

template/{{ part_dir }}/package.json.jinja

@@ -1,41 +1,65 @@
 {
   "name": "{{ project_slug }}",
-  "type": "module",
-  "private": true,
   "version": "0.0.1",
+  "private": true,
+  "type": "module",
   "scripts": {
-    "dev": "vite dev",
     "build": "vite build",
-    "preview": "vite preview",
-    "prepare": "svelte-kit sync || echo ''",
     "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
     "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
+    "dev": "vite dev",
+{%- if linter == 'biome' %}
+    "fix": "ultracite fix",
     "lint": "ultracite check",
-    "fix": "ultracite fix"
+{%- else %}
+    "fix": "prettier --write . && eslint --fix .",
+    "lint": "prettier --check . && eslint .",
+{%- endif %}
+    "prepare": "svelte-kit sync || echo ''",
+    "preview": "vite preview"
   },
   "devDependencies": {
-    "@biomejs/biome": "2.5.2",
+{%- set deps = {
-    "@sveltejs/kit": "^2.63.0",
+  "@sveltejs/kit": "^2.63.0",
-    "@sveltejs/vite-plugin-svelte": "^7.1.2",
+  "@sveltejs/vite-plugin-svelte": "^7.1.2",
-    "@tailwindcss/vite": "^4.3.0",
+  "@tailwindcss/vite": "^4.3.0",
-    "@types/bun": "^1.3.0",
+  "@types/bun": "^1.3.0",
-{% if frontend_adapter == 'bun' %}    "svelte-adapter-bun": "^1.0.1",
+  "svelte": "^5.56.1",
-{% else %}    "@sveltejs/adapter-static": "^3.0.10",
+  "svelte-check": "^4.6.0",
-{% endif %}{% if ui_library == 'shadcn' %}    "@internationalized/date": "^3.12.0",
+  "tailwindcss": "^4.3.0",
-    "@lucide/svelte": "^1.23.0",
+  "typescript": "^6.0.3",
-    "bits-ui": "^2.16.3",
+  "vite": "^8.0.16",
-    "clsx": "^2.1.1",
+} -%}
-    "mode-watcher": "^1.1.0",
+{%- if linter == 'biome' %}{% set _ = deps.update({
-    "shadcn-svelte": "^1.3.0",
+  "@biomejs/biome": "2.5.13",
-    "svelte-sonner": "^1.1.0",
+  "ultracite": "7.12.0",
-    "tailwind-merge": "^3.5.0",
+}) %}{% else %}{% set _ = deps.update({
-    "tailwind-variants": "^3.2.2",
+  "@eslint/compat": "^2.1.1",
-    "tw-animate-css": "^1.4.0",
+  "@eslint/js": "^10.0.1",
-{% endif %}    "svelte": "^5.56.1",
+  "eslint": "^10.12.0",
-    "svelte-check": "^4.6.0",
+  "eslint-config-prettier": "^10.1.8",
-    "tailwindcss": "^4.3.0",
+  "eslint-plugin-svelte": "^3.23.0",
-    "typescript": "^6.0.3",
+  "globals": "^17.13.0",
-    "ultracite": "7.9.0",
+  "prettier": "^3.9.9",
-    "vite": "^8.0.16"
+  "prettier-plugin-svelte": "^4.1.1",
+  "prettier-plugin-tailwindcss": "^0.8.1",
+  "typescript-eslint": "^8.71.1",
+}) %}{% endif -%}
+{%- if frontend_adapter == 'bun' %}{% set _ = deps.update({"svelte-adapter-bun": "^1.0.1"}) %}{% else %}{% set _ = deps.update({"@sveltejs/adapter-static": "^3.0.10"}) %}{% endif -%}
+{%- if ui_library == 'shadcn' %}{% set _ = deps.update({
+  "@internationalized/date": "^3.12.0",
+  "@lucide/svelte": "^1.23.0",
+  "bits-ui": "^2.16.3",
+  "clsx": "^2.1.1",
+  "mode-watcher": "^1.1.0",
+  "shadcn-svelte": "^1.3.0",
+  "svelte-sonner": "^1.1.0",
+  "tailwind-merge": "^3.5.0",
+  "tailwind-variants": "^3.2.2",
+  "tw-animate-css": "^1.4.0",
+}) %}{% endif %}
+{%- for name, version in deps | dictsort %}
+    "{{ name }}": "{{ version }}"{{ "," if not loop.last }}
+{%- endfor %}
   }
 }

template/{{ part_dir }}/src/lib/index.ts

@@ -1,2 +0,0 @@
-// place files you want to import through the `$lib` alias in this folder.
-// biome-ignore-all lint/suspicious/noEmptySource: temporary

template/{{ part_dir }}/src/lib/index.ts.jinja

@@ -0,0 +1,3 @@
+// place files you want to import through the `$lib` alias in this folder.
+{% if linter == 'biome' %}// biome-ignore-all lint/suspicious/noEmptySource: temporary
+{% endif %}

template/{{ part_dir }}/svelte.config.js.jinja

@@ -5,8 +5,8 @@ import adapter from "svelte-adapter-bun";
 const config = {
   compilerOptions: {
     runes: ({ filename }) =>
-      // biome-ignore lint/performance/useTopLevelRegex: svelte default behaviour
+{% if linter == 'biome' %}      // biome-ignore lint/performance/useTopLevelRegex: svelte default behaviour
-      filename.split(/[/\\]/).includes("node_modules") ? undefined : true,
+{% endif %}      filename.split(/[/\\]/).includes("node_modules") ? undefined : true,
   },
   kit: {
     adapter: adapter(),

template/{{ part_dir }}/{% if layout == 'part' %}.gitignore{% endif %}

@@ -16,8 +16,3 @@ node_modules
 # Vite
 vite.config.js.timestamp-*
 vite.config.ts.timestamp-*
-
-# Impeccable
-**/.impeccable/config.local.json
-**/.impeccable/hook.cache.json
-**/.impeccable/hook.pending.json

template/{{ part_dir }}/{% if layout == 'root' %}README.md{% endif %}.jinja

@@ -9,4 +9,8 @@ make recreate
 
 `make env` creates `.env` and `docker-compose.override.yml` from their examples. `make recreate` starts the selected profiles, `make rebuild` builds the image first, `make logs`, `make restart` and `make down` do what they say.
 
+To deploy, `git pull && make deploy`. It runs `make pre-deploy`, which rebuilds the image only when something in the repository changed, then `docker compose up -d`. A deploy system with its own `up` step calls `make pre-deploy` before it and `make post-deploy` after. What was built is remembered as `refs/deploy/*` in the clone.
+
+In the fleet, production is deployed from `infra/komodo` instead (git mode of Komodo, see `docs/architecture.md` there): Komodo clones this repo, and a layer plus `deploy.sh` in the stack's directory tag images by the hash of what they bake in and write `.env` from sops. The repo only has to stay a plain recipe: images built from `build:` in compose, `caddy/site.caddy`. `make deploy` and `refs/deploy/*` are for a checkout deployed by hand.
+
 `make dev` runs the Vite dev server on the host, `make fmt` formats, `make check` runs svelte-check and the linter.

template/{{ part_dir }}/{% if linter == 'biome' %}biome.jsonc{% endif %}.jinja

@@ -2,13 +2,7 @@
   "$schema": "./node_modules/@biomejs/biome/configuration_schema.json",
   "extends": ["ultracite/biome/core", "ultracite/biome/svelte"],
   "files": {
-    "includes": [
+    "includes": ["!.claude", "!.svelte-kit", "!build", "!.mcp.json"]
-      "!.claude",
-      "!.svelte-kit",
-      "!build",
-      "!.mcp.json",
-      "!.impeccable"
-    ]
   },
   "javascript": { "globals": ["Bun"] },
   "overrides": [

template/{{ part_dir }}/{% if linter == 'eslint' %}.prettierignore{% endif %}

@@ -0,0 +1,14 @@
+# Package managers
+package-lock.json
+pnpm-lock.yaml
+yarn.lock
+bun.lock
+bun.lockb
+
+# Written by copier and the infra template, not by hand
+.copier/
+*.md
+renovate.jsonc
+
+# Miscellaneous
+/static/

template/{{ part_dir }}/{% if linter == 'eslint' %}.prettierrc{% endif %}

@@ -0,0 +1,6 @@
+{
+  "trailingComma": "es5",
+  "plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
+  "overrides": [{ "files": "*.svelte", "options": { "parser": "svelte" } }],
+  "tailwindStylesheet": "./src/routes/layout.css"
+}

template/{{ part_dir }}/{% if linter == 'eslint' %}eslint.config.js{% endif %}.jinja

@@ -0,0 +1,49 @@
+import { fileURLToPath } from "node:url";
+import { includeIgnoreFile } from "@eslint/compat";
+import js from "@eslint/js";
+import prettier from "eslint-config-prettier";
+import svelte from "eslint-plugin-svelte";
+import { defineConfig } from "eslint/config";
+import globals from "globals";
+import ts from "typescript-eslint";
+import svelteConfig from "./svelte.config.js";
+
+const gitignorePath = fileURLToPath(new URL("./.gitignore", import.meta.url));
+
+export default defineConfig(
+  includeIgnoreFile(gitignorePath),
+  js.configs.recommended,
+  ...ts.configs.recommended,
+  ...svelte.configs.recommended,
+  prettier,
+  ...svelte.configs.prettier,
+  {
+    languageOptions: { globals: { ...globals.browser, ...globals.node } },
+    rules: {
+      // typescript-eslint recommends against no-undef on TypeScript projects:
+      // https://typescript-eslint.io/troubleshooting/faqs/eslint/#i-get-errors-from-the-no-undef-rule-about-global-variables-not-being-defined-even-though-there-are-no-typescript-errors
+      "no-undef": "off",
+    },
+  },
+{%- if ui_library == 'shadcn' %}
+  {
+    // shadcn-svelte primitives are copied in and changed upstream only.
+    files: ["src/lib/components/ui/**"],
+    rules: {
+      "@typescript-eslint/no-explicit-any": "off",
+      "svelte/no-navigation-without-resolve": "off",
+    },
+  },
+{%- endif %}
+  {
+    files: ["**/*.svelte", "**/*.svelte.ts", "**/*.svelte.js"],
+    languageOptions: {
+      parserOptions: {
+        extraFileExtensions: [".svelte"],
+        parser: ts.parser,
+        projectService: true,
+        svelteConfig,
+      },
+    },
+  }
+);

template/{{ part_dir }}/{% if serve != 'api' %}Dockerfile{% endif %}.jinja

@@ -1,20 +1,44 @@
 {% if frontend_adapter == 'bun' -%}
-FROM oven/bun:alpine
+FROM oven/bun:alpine AS deps
 
 ENV TERM=xterm-256color
 ENV COLORTERM=truecolor
+ENV BUN_INSTALL_CACHE_DIR=/bun-cache
 
 WORKDIR /app
 
 COPY package.json bun.lock* ./
 
-RUN bun install --frozen-lockfile
+RUN --mount=type=cache,target=/bun-cache bun install --frozen-lockfile
+
+
+# .env is in the context ($env/static/* are inlined at build) and stays in
+# this stage: the runtime image below gets build/ and production deps only.
+FROM deps AS builder
 
 COPY . .
 
 RUN bun --bun svelte-kit sync
 RUN bun --bun run build
 
+
+FROM oven/bun:alpine AS runtime
+
+ENV NODE_ENV=production
+# The cache mount only holds files; without the variable bun caches into
+# ~/.bun inside the image.
+ENV BUN_INSTALL_CACHE_DIR=/bun-cache
+
+WORKDIR /app
+
+COPY package.json bun.lock* ./
+
+RUN --mount=type=cache,target=/bun-cache bun install --frozen-lockfile --production
+
+COPY --from=builder /app/build ./build
+
+EXPOSE 3000
+
 ENTRYPOINT ["bun"]
 CMD ["build/index.js"]
 {%- else -%}