Vite

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

TL;DR

// 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

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' }`

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.

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.

Vite

TL;DR

Verifying it works

Framework notes

On this page