AppHost logoAppHost

Devii · Frontend · 2026-03-17 · 7 min read

Share

Vite: Native ESM Dev Server And Rollup Production Builds

Why Vite feels fast in development, how pre-bundling works, and the Rollup output stage.

**Vite** serves source files as native **ES modules** during development, transforming only requested modules on demand. Dependencies pre-bundle with **esbuild** to flatten deep `node_modules` trees into ESM the browser can load efficiently.

Production builds use **Rollup** for tree-shaking and chunk splitting. Plugins bridge Vue, React JSX, legacy browser targets via `@vitejs/plugin-legacy`, and environment variable injection.

Bundle analysis
Bundle analysis

Configure `server.proxy` for local API forwarding. Use `build.rollupOptions.output.manualChunks` when you have evidence for split points, not prematurely.

Official docs: `vite.dev`. Vite underpins many frameworks (Vue, SvelteKit, Astro integrations). Pin Vite major with framework compatibility tables.