Vite single-page apps (React, Vue, Svelte)

A Vite app (vite in the dependencies with a vite.config.*, an index.html or a vite build script) is built with your build script and served by nginx. The log names the flavour it detected, for example Vite + React (static), Vite + Vue (static) or Vite + Svelte (static) (also Solid, Preact and Lit).

What you get

• the dist/ folder (or build.outDir from vite.config.*) served on $PORT;
• client-side routing: unknown paths return index.html, so Vue Router and React Router history mode work;
• /assets/* cached for a year (the file names are content-hashed), HTML always revalidated;
• gzip and a /healthz endpoint.

Environment variables

VITE_* variables are inlined at build time. Set them in the service's Variables, for example:

VITE_API_URL=https://${{api.FJORDRUN_PUBLIC_DOMAIN}}

A changed value needs a rebuild; saving the variable redeploys the service. See Build variables.

Do not use vite preview in production

vite preview rejects unknown host names (Blocked request. This host is not allowed) and is not built for production traffic. Fjordrun ignores it as a start command and serves the build with nginx. Leave the start command empty.

Create React App and Vue CLI

react-scripts (served from build/) and @vue/cli-service (served from dist/) apps are handled the same way.