vite-mastery

About this site

Why write this guide?

In March 2026, Vite 8 shipped. It brought the unified Rolldown bundler, the Environment API, the @vitejs/devtools early preview and more — yet most tutorials still stop at the Vite 5 era: editing vite.config.ts, tweaking plugin options, running build.

This site does one thing: it opens the core black boxes of Vite 8 and explains them.

Promises

  • Every code sample targets Vite 8.1.x and actually runs
  • Vite 7 differences live inside <V7Note> blocks — the main text stays on Vite 8
  • Environment API content is marked as RC, no made-up APIs
  • Ten companion projects take you from reading to shipping

Author

Cyrus Doyle(@yonjay) —— Frontend engineer · obsessed with build tools and DX

Working on build tools and developer experience for a long time. This guide is part personal learning log for Vite 8, part attempt to help other engineers actually understand how Vite works.

How to contribute

Spotted an error, got a better explanation, want to add a new project? You're welcome to:

Stack

The site itself is a working sample of the Vite 8 ecosystem:

  • Next.js 16 App Router + TypeScript 6
  • Tailwind CSS v4 (CSS-first)
  • pnpm workspace + Turborepo
  • content-collections + MDX
  • Shiki with twoslash
  • Deployed on Vercel