Inside a pipeline: demystifying Vite and its plugins

Vite sits between source files and the browser, transforming modules when requests arrive and bundling code for production. This talk explains why imports for CSS, images, JSX, and other file types work even though browsers do not understand those formats directly.

It then develops Vite plugins around module hooks and lifecycle hooks. Through concrete examples, it covers code transformation, external Markdown loading, virtual modules, generated routes, virtual data, icons, build metadata, HMR, middleware, macros, command execution, Laravel Vite, and Nitro.