--- og_image: "/images/guides/rollup-vs-vite-2026.webp" title: "Rollup vs Vite 2026: When You Need a Dedicated Bundler" description: "Vite uses Rollup under the hood for production builds. When should you use Rollup directly instead of Vite? Compare use cases, configuration, and tradeoffs." date: "2026-03-08" authors: ["team"] tier: 1 tags: ["rollup", "vite", "bundlers", "libraries", "comparison", "2026"] --- ## TL;DR **Vite for apps, Rollup for libraries — and Vite uses Rollup internally anyway.** Vite (~18M weekly downloads) is the default for web applications in 2026. Rollup (~15M downloads) remains the best choice for building JavaScript/TypeScript libraries that will be published to npm. The key distinction: Vite wraps Rollup with a development server, HMR, and framework plugins that you simply do not need when building a library destined for npm. For app development, reach for Vite. For library authoring with precise output control, reach for Rollup. ## Key Takeaways - **Vite uses Rollup for production builds** — they share the same output quality - **Rollup produces the cleanest library bundles** — best tree-shaking in the ecosystem - **Vite is better for applications** — dev server, HMR, plugin ecosystem for frameworks - **Vite also has a library mode** (`build.lib`) — but bare Rollup gives more output control - **Rollup plugin ecosystem** is fully available in Vite (backward compatible) - **tsup** is the modern shortcut — wraps esbuild but produces Rollup-quality output for 90% of library use cases --- ## The Relationship Between Rollup and Vite Vite is not a competitor to Rollup. It is built on top of Rollup: ``` Vite architecture: ┌─────────────────────────────────────┐ │ Vite │ │ ├── Dev server (native ESM) │ │ ├── esbuild (transpile + dep prep) │ │ └── Rollup (production builds) ←──┼── This IS Rollup └─────────────────────────────────────┘ ``` When you run `vite build`, you are running Rollup with Vite's plugin transform layer on top. The output quality is identical to running Rollup directly. This means choosing between them is not about output quality — it is about what else you need around the build step. For an application, you want Vite because you get hot module replacement during development, CSS handling, image optimization, and a plugin ecosystem tuned for React, Vue, Svelte, and other frameworks. For a library, you want Rollup (or a Rollup-based tool) because you only care about the production artifact. There is no dev server, no browser, no HMR — just an input file and a set of output formats. --- ## Why Use Rollup Directly for Library Authoring When you publish a package to npm, your consumers will use Vite, webpack, or some other bundler to consume your package. What matters to them: 1. An ESM output (`dist/index.js`) for tree-shaking 2. A CJS output (`dist/index.cjs`) for Node.js compatibility 3. A UMD output if you need CDN usage via `