# Deployment on Vercel

Mechanica is Vercel-ready as a static Vite application.

## Build settings

Use the default Vercel Vite settings or configure:

| Setting | Value |
| --- | --- |
| Framework preset | Vite |
| Install command | `npm install` |
| Build command | `npm run build` |
| Output directory | `dist` |

## Environment variables

Copy values from `.env.example` as needed:

```text
VITE_APP_NAME=Mechanica
VITE_ASSET_BASE_URL=/assets
VITE_ENABLE_DEBUG_OVERLAYS=false
VITE_ENABLE_SOURCEMAPS=false
```

Only `VITE_` variables are exposed to the client bundle.

## SPA routing

`vercel.json` rewrites all routes to `index.html`, so deep links such as the following work after deployment:

```text
/machines/turbojet-engine?preset=isometric&explode=0.7
```

## Asset caching

`vercel.json` adds long-lived immutable caching for `/assets/*`. Production GLB and texture files should use content-hashed filenames or explicit versioned paths before relying on immutable caching.

## Pre-deployment checks

Run:

```bash
npm run typecheck
npm run lint
npm run format:check
npm run build
```

Then preview locally:

```bash
npm run preview
```

## Social previews

The current `index.html` provides generic Mechanica meta tags. Per-machine social previews require either:

1. Static prerendered HTML per machine route, or
2. Vercel edge/serverless metadata rendering, or
3. A route manifest used by a prerender step.

The registry already contains the machine metadata needed to generate titles and descriptions.