# Vite

Vite is the foundation for SvelteKit, Nuxt, Astro, SolidStart, and
Vite-based React.

## TL;DR

```ts
// vite.config.ts
import { defineConfig } from 'vite';

const crossOriginIsolation = {
  'Cross-Origin-Opener-Policy': 'same-origin',
  'Cross-Origin-Embedder-Policy': 'require-corp',
};

export default defineConfig({
  // exclude from dev-optimizer
  optimizeDeps: { exclude: ['@mudomi/onykia-engine'] },
  worker: { format: 'es' },
  build: { target: 'esnext' },

  // cross-origin isolation
  server: { headers: crossOriginIsolation },
  preview: { headers: crossOriginIsolation },
});
```

Call `createWasmFactory()` as in Quickstart. That's the whole integration.

## Verifying it works

```bash
npm run dev
```
If the preview is blank, check the browser console:

| Console message | Cause | Fix |
|---|---|---|
| `SharedArrayBuffer is not defined` / `requires a cross-origin-isolated host page` | Headers missing or stripped (e.g. by a proxy) | COOP/COEP on `server`/`preview` and at your prod host |
| `optimized info should be defined` / 404 under `.vite/deps/` | Dep-optimizer mangled the asset URLs | Add the engine to `optimizeDeps.exclude`, then delete `node_modules/.vite` and restart |
| Worker fails with an `import` syntax error | Worker emitted as a classic worker | `worker: { format: 'es' }` |

> [!TIP]
> After changing `optimizeDeps`, delete `node_modules/.vite` and restart the dev
> server - Vite caches optimizer results and won't re-run on config change alone.

## Framework notes

the  `optimizeDeps`, `worker`, and `build` settings above apply unchanged. The only
difference is *where* you set COOP/COEP for production, since these frameworks
serve the built app themselves (a hook, adapter config, or server middleware
rather than Vite's `server.headers`). See the framework's own guide.