PART 07
Production build
Rolldown chunking, lightningcss, baseline targets, Module Federation.
- 7.1Rolldown's Role in the Vite 8 BuildHow Vite build uses Rolldown, how to configure rolldownOptions, how rollupOptions migration works, and how minification, manifests, and chunk caching fit together.
- 7.2Asset PipelineImages, fonts, JSON, WASM — how Vite handles static assets. What the ?url, ?raw, and ?inline suffixes mean, and what changes after Rolldown takes over.
- 7.3CSS ProcessingThe full CSS processing pipeline in Vite 8 — lightningcss minification, the PostCSS pipeline, CSS Modules, and how CSS-in-JS fits in. What new capabilities does lightningcss bring after replacing esbuild?
- 7.4Code Splitting and Chunk StrategyRolldown's code splitting mechanism — automatic splitting via dynamic import, manual control with manualChunks, and chunk naming strategies. How to optimize output size and loading performance.
- 7.5Default target: baseline-widely-availableThe baseline-widely-available target introduced in Vite 7+ — what is Baseline? How does it determine compiled output? Why is it better than writing browserlist by hand?
- 7.6Module Federation (Unlocked by Rolldown)Module Federation lets multiple independently deployed applications share code at runtime — Vite 8 natively supports this capability through Rolldown. Concept introduction and basic configuration.
- 7.7Project 4: Image Optimizer PluginUse generateBundle + this.emitFile to implement automatic image compression at build time — integrate sharp, convert PNG/JPEG to WebP/AVIF, and output a build report.
- 7.8Backend Integration: When Vite Does Not Own HTMLHow to integrate Vite with Rails, Laravel, Express, Go templates, or any backend that renders HTML while Vite owns assets, HMR, and the production manifest.
- 7.9Deployment Paths, Base, and ManifestsProduction deployment is more than vite build. Learn base paths, relative deployments, static hosting, chunk 404s, manifests, modulepreload, and cache policy.