Files
RecipesCam/docker/frontend/vite.config.ts
T
3dtours 36cd711302 web: the header wears the theme, and the rail says which build it is
Two things the studio could not say about itself.

The preset the header has open was painted in the dim text colour, the same grey
as the page name beside it — so the one label up there that changes with the look
read as chrome. It now takes the theme's own accent, the colour the brand mark
and the open tab already carry, which means it follows both the light/dark mode
and the accent group the reader picked, out of the CSS token and with no colour
written into the component.

And an image has no other mark on it: once the frontend tarball is loaded on the
NAS as `:latest`, nothing on the box says which revision came off. The rail now
names the build at its foot — quiet, mono, wrapping rather than widening the
column, and gone under 860px where the rail is the phone's scrolling tab bar
instead of a column.

The name is stamped into the bundle at build time: vite.config reads VERSION
from the environment (`docker compose build frontend --build-arg
VERSION=$(git rev-parse --short HEAD)`) and falls back to the package version
plus the minute it was built, so two builds of the same tree are never the same
name. `ARG VERSION=` in the Dockerfile is the knob; the bare `npm run build` —
dev server, check scripts — still stamps its own time, and the dev server passes
nothing at all, so the line only draws when there is something to say.

Verified:
  library-check.mjs — 37 steps, all passed, the two new ones reading the header
    off the running studio: the rail foot names the build (0.1.0+202609281504)
    and the preset chip's computed colour is the brand's accent, not a grey —
    rgb(206, 117, 9) amber, rgb(93, 24, 191) after switching to violet.
  scan-nav-check.mjs and roll-walk-check.mjs — all passed. frontend tsc --noEmit
    clean. Live 8090 on index-… matching dist/: /, /library and /app 200 with 0
    console errors.

ponytail: the name is the package version plus a caller-supplied tag, and nothing
bumps the package version, so the tag is the whole identity — have the release
job write it into package.json if the numbers ever need to mean something.
2026-09-28 22:06:22 +07:00

50 lines
2.3 KiB
TypeScript

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import { fileURLToPath, URL } from 'node:url';
import pkg from './package.json';
// The build's own name, handed to the bundle as an env var and printed at the
// foot of the studio's tab rail. The caller names it (`VERSION=$(git rev-parse
// --short HEAD) docker compose build`, see Dockerfile); left alone, the build
// stamps the minute it ran, so two builds are never the same name and an
// operator can tell which image is up.
const version = `${pkg.version}+${process.env.VERSION || new Date().toISOString().slice(0, 16).replace(/[-:T]/g, '')}`;
// Vite hands the VITE_ ones to the page, and it reads this very `process.env`
// when it builds `import.meta.env` — so the name is set here and read there.
process.env.VITE_VERSION = version;
// The app is shared source with the React Native app: `frameUtils.ts` and
// `skiaImage.ts` import `@shopify/react-native-skia`, and the alias below swaps
// that for the CanvasKit adapter. Same trick the W0 spike used, now for the app.
export default defineConfig({
plugins: [react()],
resolve: {
// onnxruntime-web ships two flavours of its default entry: one with the
// runtime's wasm inlined as a build asset, one that fetches it at runtime.
// This picks the second, so the 28MB binary is served from /wasm/ort/ (see
// scripts/copy-wasm.mjs) instead of being emitted twice into dist.
conditions: ['onnxruntime-web-use-extern-wasm'],
alias: {
'@shopify/react-native-skia': fileURLToPath(new URL('./src/engine/skiaShim.ts', import.meta.url)),
},
},
build: {
target: 'es2022',
// canvaskit-wasm's glue JS is ~2.5MB on its own; the wasm is fetched at
// runtime from /wasm/, never bundled.
chunkSizeWarningLimit: 9000,
},
optimizeDeps: {
// libraw-wasm starts its own worker with `new URL('./worker.js',
// import.meta.url)`. Pre-bundling moves the module into .vite/deps/, where
// that sibling does not exist and the worker never loads. Excluding it keeps
// the package's own relative layout; the production build resolves it
// normally either way.
exclude: ['libraw-wasm'],
},
server: {
port: 5173,
proxy: { '/api': process.env.API_ORIGIN ?? 'http://localhost:3000' },
},
});