Blog
Announcing Vite 2.0
February 16, 2021 - Check out the Vite 3.0 announcement
Today we are excited to announce the official release of Vite 2.0!
Vite (French word for "fast", pronounced
/vit/) is a new kind of build tool for frontend web development. Think a pre-configured dev server + bundler combo, but leaner and faster. It leverages browser's native ES modules support and tools written in compile-to-native languages like esbuild to deliver a snappy and modern development experience.
To get a sense of how fast Vite is, check out this video comparison of booting up a React application on Repl.it using Vite vs.
create-react-app (CRA).
If you've never heard of Vite before and would love to learn more about it, check out the rationale behind the project. If you are interested in how Vite differs from other similar tools, check out the comparisons.
What's New in 2.0
Since we decided to completely refactor the internals before 1.0 got out of RC, this is in fact the first stable release of Vite. That said, Vite 2.0 brings about many big improvements over its previous incarnation:
Framework Agnostic Core
The original idea of Vite started as a hacky prototype that serves Vue single-file components over native ESM. Vite 1 was a continuation of that idea with HMR implemented on top.
Vite 2.0 takes what we learned along the way and is redesigned from scratch with a more robust internal architecture. It is now completely framework agnostic, and all framework-specific support is delegated to plugins. There are now official templates for Vue, React, Preact, Lit Element, and ongoing community efforts for Svelte integration.
New Plugin Format and API
Inspired by WMR, the new plugin system extends Rollup's plugin interface and is compatible with many Rollup plugins out of the box. Plugins can use Rollup-compatible hooks, with additional Vite-specific hooks and properties to adjust Vite-only behavior (e.g. differentiating dev vs. build or custom handling of HMR).
The programmatic API has also been greatly improved to facilitate higher level tools / frameworks built on top of Vite.
esbuild Powered Dep Pre-Bundling
Since Vite is a native ESM dev server, it pre-bundles dependencies to reduce the number browser requests and handle CommonJS to ESM conversion. Previously Vite did this using Rollup, and in 2.0 it now uses
esbuild which results in 10-100x faster dependency pre-bundling. As a reference, cold-booting a test app with heavy dependencies like React Material UI previously took 28 seconds on an M1-powered MacBook Pro and now takes ~1.5 seconds. Expect similar improvements if you are switching from a traditional bundler based setup.
First-class CSS Support
Vite treats CSS as a first-class citizen of the module graph and supports the following out of the box:
Resolver enhancement:
@import and
url() paths in CSS are enhanced with Vite's resolver to respect aliases and npm dependencies.
URL rebasing:
url() paths are automatically rebased regardless of where the file is imported from.
CSS code splitting: a code-split JS chunk also emits a corresponding CSS file, which is automatically loaded in parallel with the JS chunk when requested.
Server-Side Rendering (SSR) Support
Vite 2.0 ships with experimental SSR support. Vite provides APIs to efficiently load and update ESM-based source code in Node.js during development (almost like server-side HMR), and automatically externalizes CommonJS-compatible dependencies to improve development and SSR build speed. The production server can be completely decoupled from Vite, and the same setup can be easily adapted to perform pre-rendering / SSG.
Vite SSR is provided as a low-level feature and we are expecting to see higher level frameworks leveraging it under the hood.
Opt-in Legacy Browser Support
Vite targets modern browsers with native ESM support by default, but you can also opt-in to support legacy browsers via the official @vitejs/plugin-legacy. The plugin automatically generates dual modern/legacy bundles, and delivers the right bundle based on browser feature detection, ensuring more efficient code in modern browsers that support them.
Give it a Try!
That was a lot of features, but getting started with Vite is simple! You can spin up a Vite-powered app literally in a minute, starting with the following command (make sure you have Node.js >=12):
npm init @vitejs/app
Then, check out the guide to see what Vite provides out of the box. You can also check out the source code on GitHub, follow updates on Twitter, or join discussions with other Vite users on our Discord chat server.
Vite 3.0 is out!
July 23, 2022 - Check out the Vite 4.0 announcement
In February last year, Evan You released Vite 2. Since then, its adoption has grown non-stop, reaching more than 1 million npm downloads per week. A sprawling ecosystem rapidly formed after the release. Vite is powering a renewed innovation race in Web frameworks. Nuxt 3 uses Vite by default. SvelteKit, Astro, Hydrogen, and SolidStart are all built with Vite. Laravel has now decided to use Vite by default. Vite Ruby shows how Vite can improve Rails DX. Vitest is making strides as a Vite-native alternative to Jest. Vite is behind Cypress and Playwright's new Component Testing features, Storybook has Vite as an official builder. And the list goes on. Maintainers from most of these projects got involved in improving the Vite core itself, working closely with the Vite team and other contributors.
Today, 16 months from the v2 launch we are happy to announce the release of Vite 3. We decided to release a new Vite major at least every year to align with Node.js's EOL, and take the opportunity to review Vite's API regularly with a short migration path for projects in the ecosystem.
Quick links:
Docs
Migration Guide
Changelog
If you are new to Vite, we recommend reading the Why Vite Guide. Then check out the Getting Started and Features guide to see what Vite provides out of the box. As usual, contributions are welcome at GitHub. More than 600 collaborators have helped improve Vite so far. Follow the updates on Twitter, or join discussions with other Vite users on our Discord chat server.
New Documentation
Go to vite.dev to enjoy the new v3 docs. Vite is now using the new VitePress default theme, with a stunning dark mode between other features.
Several projects in the ecosystem have already migrated to it (see Vitest, vite-plugin-pwa, and VitePress itself).
If you need to access the Vite 2 docs, they will remain online at v2.vite.dev. There is also a new main.vite.dev subdomain, where each commit to Vite’s main branch is auto deployed. This is useful when testing beta versions or contributing to the core’s development.
There is also now an official Spanish translation, that has been added to the previous Chinese and Japanese translations:
简体中文
日本語
Español
Create Vite Starter Templates
create-vite templates have been a great tool to quickly test Vite with your favorite framework. In Vite 3, all of the templates got a new theme in line with the new docs. Open them online and start playing with Vite 3 now:
The theme is now shared by all templates. This should help better convey the scope for these starters as minimal templates to get started with Vite. For more complete solutions including linting, testing setup, and other features, there are official Vite-powered templates for some frameworks like create-vue and create-svelte. There is a community-maintained list of templates at Awesome Vite.
Dev Improvements
Vite CLI
VITE v3.0.0 ready in 320 ms
➜ Local: http://127.0.0.1:5173/
➜ Network: use --host to expose
Apart from the CLI’s aesthetics improvements, you’ll notice that the default dev server port is now 5173 and the preview server listening at 4173. This change ensures Vite will avoid collisions with other tools.
Improved WebSocket Connection Strategy
One of the pain points of Vite 2 was configuring the server when running behind a proxy. Vite 3 changes the default connection scheme so it works out of the box in most scenarios. All these setups are now tested as part of the Vite Ecosystem CI through
vite-setup-catalogue.
Cold Start Improvements
Vite now avoids full reload during cold start when imports are injected by plugins while crawling the initial statically imported modules (#8869).
Click to learn more
In Vite 2.9, both the scanner and optimizer were run in the background. In the best scenario, where the scanner would find every dependency, no reload was needed in cold start. But if the scanner missed a dependency, a new optimization phase and then a reload were needed. Vite was able to avoid some of these reloads in v2.9, as we detected if the new optimized chunks were compatible with the ones the browser had. But if there was a common dep, the sub-chunks could change and a reload was required to avoid duplicated state. In Vite 3, the optimized deps aren't handed to the browser until the crawling of static imports is done. A quick optimization phase is issued if there is a missing dep (for example, injected by a plugin), and only then, the bundled deps are sent. So, a page reload is no longer needed for these cases.
import.meta.glob
import.meta.glob support was rewritten. Read about the new features in the Glob Import Guide:
Multiple Patterns can be passed as an array
import.meta.glob(['./dir/*.js', './another/*.js'])
Negative Patterns are now supported (prefixed with
!) to ignore some specific files
import.meta.glob(['./dir/*.js', '!**/bar.js'])
Named Imports can be specified to improve tree-shaking
import.meta.glob('./dir/*.js', { import: 'setup' })
Custom Queries can be passed to attach metadata
import.meta.glob('./dir/*.js', { query: { custom: 'data' } })
Eager Imports is now passed as a flag
import.meta.glob('./dir/*.js', { eager: true })
Aligning WASM Import with Future Standards
The WebAssembly import API has been revised to avoid collisions with future standards and to make it more flexible:
import init from './example.wasm?init'
init().then((instance) => {
instance.exports.test()
})
Learn more in the WebAssembly guide
Build Improvements
ESM SSR Build by Default
Most SSR frameworks in the ecosystem were already using ESM builds. So, Vite 3 makes ESM the default format for SSR builds. This allows us to streamline previous SSR externalization heuristics, externalizing dependencies by default.
Improved Relative Base Support
Vite 3 now properly supports relative base (using
base: ''), allowing built assets to be deployed to different bases without re-building. This is useful when the base isn't known at build time, for example when deploying to content-addressable networks like IPFS.
Experimental Features
Built Asset Paths fine-grained Control (Experimental)
There are other deploy scenarios where this isn't enough. For example, if the generated hashed assets need to be deployed to a different CDN from the public files, then finer-grained control is required over path generation at build time. Vite 3 provides an experimental API to modify the built file paths. Check Build Advanced Base Options for more information.
Esbuild Deps Optimization at Build Time (Experimental)
One of the main differences between dev and build time is how Vite handles dependencies. During build time,
@rollup/plugin-commonjs is used to allow importing CJS only dependencies (like React). When using the dev server, esbuild is used instead to pre-bundle and optimize dependencies, and an inline interop scheme is applied while transforming user code importing CJS deps. During the development of Vite 3, we introduced the changes needed to also allow the use of esbuild to optimize dependencies during build time.
@rollup/plugin-commonjs can then be avoided, making dev and build time work in the same way.
Given that Rollup v3 will be out in the next months, and we're going to follow up with another Vite major, we've decided to make this mode optional to reduce v3 scope and give Vite and the ecosystem more time to work out possible issues with the new CJS interop approach during build time. Frameworks may switch to using esbuild deps optimization during build time by default at their own pace before Vite 4.
HMR Partial Accept (Experimental)
There is opt-in support for HMR Partial Accept. This feature could unlock finer-grained HMR for framework components that export several bindings in the same module. You can learn more at the discussion for this proposal.
Bundle Size Reduction
Vite cares about its publish and install footprint; a fast installation of a new app is a feature. Vite bundles most of its dependencies and tries to use modern lightweight alternatives where possible. Continuing with this ongoing goal, Vite 3 publish size is 30% smaller than v2.
Publish Size
Install Size
Vite 2.9.14
4.38MB
19.1MB
Vite 3.0.0
3.05MB
17.8MB
Reduction
-30%
-7%
In part, this reduction was possible by making some dependencies that most users weren't needing optional. First, Terser is no longer installed by default. This dependency was no longer needed since we already made esbuild the default minifier for both JS and CSS in Vite 2. If you use
build.minify: 'terser', you'll need to install it (
npm add -D terser). We also moved node-forge out of the monorepo, implementing support for automatic https certificate generation as a new plugin:
@vitejs/plugin-basic-ssl. Since this feature only creates untrusted certificates that are not added to the local store, it didn't justify the added size.
Bug Fixing
A triaging marathon was spearheaded by @bluwyoo, @sapphi_red, that recently joined the Vite team. During the past three months, the Vite open issues were reduced from 770 to 400. And this dive was achieved while the newly open PRs were at an all-time high. At the same time, @haoqunjiang had also curated a comprehensive overview of Vite issues.
Compatibility Notes
Vite no longer supports Node.js 12 / 13 / 15, which reached its EOL. Node.js 14.18+ / 16+ is now required.
Vite is now published as ESM, with a CJS proxy to the ESM entry for compatibility.
The Modern Browser Baseline now targets browsers which support the native ES Modules, native ESM dynamic import, and
import.meta features.
JS file extensions in SSR and library mode now use a valid extension (
js,
mjs, or
cjs) for output JS entries and chunks based on their format and the package type.
Learn more in the Migration Guide.
Upgrades to Vite Core
While working towards Vite 3, we also improved the contributing experience for collaborators to Vite Core.
Unit and E2E tests have been migrated to Vitest, providing a faster and more stable DX. This move also works as dog fooding for an important infrastructure project in the ecosystem.
VitePress build is now tested as part of CI.
Vite upgraded to pnpm 7, following the rest of the ecosystem.
Playgrounds have been moved to
/playgrounds out of packages directory.
The packages and playgrounds are now
"type": "module".
Plugins are now bundled using unbuild, and plugin-vue-jsx and plugin-legacy were moved to TypeScript.
The Ecosystem is Ready for v3
We have worked closely with projects in the ecosystem to ensure that frameworks powered by Vite are ready for Vite 3. vite-ecosystem-ci allows us to run the CI's from the leading players in the ecosystem against Vite's main branch and receive timely reports before introducing a regression. Today's release should soon be compatible with most projects using Vite.
Acknowledgments
Vite 3 is the result of the aggregate effort of members of the Vite Team working together with ecosystem project maintainers and other collaborators to Vite core.
We want to thank everyone who has implemented features, and fixes, given feedback, and have been involved in Vite 3:
Vite team members @youyuxi, @patak_dev, @antfu7, @bluwyoo, @sapphi_red, @haoqunjiang, @poyoho, @Shini_92, and @retropragma.
@benmccann, @danielcroe, @brillout, @sheremet_va, @userquin, @enzoinnocenzi, @maximomussini, @IanVanSchooten, the Astro team, and all other maintainers of frameworks and plugins in the ecosystem in that helped shape v3.
@dominikg for his work on vite-ecosystem-ci.
@ZoltanKochan for his work on pnpm, and for his responsiveness when we needed support with it.
@rixo for HMR Partial Accept support.
@KiaKing85 for getting the theme ready for the Vite 3 release, and @_brc_dd for working on the VitePress internals.
@CodingWithCego for the new Spanish translation, and @ShenQingchuan, @hiro-lapis and others in the Chinese and Japanese translations teams for keeping the translated docs up to date.
We also want to thank individuals and companies sponsoring the Vite team, and companies investing in Vite development: some of @antfu7's work on Vite and the ecosystem is part of his job at Nuxt Labs, and StackBlitz hired @patak_dev to work full time on Vite.
What's Next
We'll take the following months to ensure a smooth transition for all the projects built on top of Vite. So the first minors will be focused on continuing our triaging efforts with a focus on newly opened issues.
The Rollup team is working on its next major, to be released in the following months. Once the Rollup plugins ecosystem has time to update, we'll follow up with a new Vite major. This will give us another opportunity to introduce more significant changes this year, which we could take to stabilize some of the experimental features introduced in this release.
If you are interested in helping improve Vite, the best way to get on board is to help with triaging issues. Join our Discord and look for the
#contributing channel. Or get involved in our
#docs,
#help others, or create plugins. We are just getting started. There are many open ideas to keep improving Vite's DX.
Vite 4.3 is out!
April 20, 2023
Quick links:
Docs: English, 简体中文, 日本語, Español, Português
Vite 4.3 Changelog
Performance Improvements
In this minor, we focused on improving the dev server performance. The resolve logic got streamlined, improving hot paths and implementing smarter caching for finding
package.json, TS config files, and resolved URL in general.
You can read a detailed walkthrough of the performance work done in this blog post by one of Vite Contributors: How we made Vite 4.3 faaaaster 🚀.
This sprint resulted in speed improvements across the board compared to Vite 4.2.
These are the performance improvements as measured by sapphi-red/performance-compare, which tests an app with 1000 React Components cold and warm dev server startup time as well as HMR times for a root and a leaf component:
Vite (babel)
Vite 4.2
Vite 4.3
Improvement
dev cold start
17249.0ms
5132.4ms
-70.2%
dev warm start
6027.8ms
4536.1ms
-24.7%
Root HMR
46.8ms
26.7ms
-42.9%
Leaf HMR
27.0ms
12.9ms
-52.2%
Vite (swc)
Vite 4.2
Vite 4.3
Improvement
dev cold start
13552.5ms
3201.0ms
-76.4%
dev warm start
4625.5ms
2834.4ms
-38.7%
Root HMR
30.5ms
24.0ms
-21.3%
Leaf HMR
16.9ms
10.0ms
-40.8%
You can read more information about the benchmark here. Specs and Versions for this performance run:
CPU: Ryzen 9 5900X, Memory: DDR4-3600 32GB, SSD: WD Blue SN550 NVME SSD
Windows 10 Pro 21H2 19044.2846
Node.js 18.16.0
Vite and React Plugin versions
Vite 4.2 (babel): Vite 4.2.1 + plugin-react 3.1.0
Vite 4.3 (babel): Vite 4.3.0 + plugin-react 4.0.0-beta.1
Vite 4.2 (swc): Vite 4.2.1 + plugin-react-swc 3.2.0
Vite 4.3 (swc): Vite 4.3.0 + plugin-react-swc 3.3.0
Early adopters have also reported seeing 1.5x-2x dev startup time improvement on real apps while testing the Vite 4.3 beta. We'd love to know the results for your apps.
Profiling
We'll continue to work on Vite's performance. We're working on an official Benchmark tool for Vite that let us get performance metrics for each Pull Request.
And vite-plugin-inspect now has more performance-related features to help you identify which plugins or middlewares are the bottleneck for your applications.
Using
vite --profile (and then pressing
p) once the page loads will save a CPU profile of the dev server startup. You can open them in an app as speedscope to identify performance issues. And you can share your findings with the Vite Team in a Discussion or in Vite's Discord.
Next Steps
We decided to do a single Vite Major this year aligning with the EOL of Node.js 16 in September, dropping support for both Node.js 14 and 16 in it. If you would like to get involved, we started a Vite 5 Discussion to gather early feedback.
Vite 4.0 is out!
December 9, 2022 - Check out the Vite 5.0 announcement
Vite 3 was released five months ago. npm downloads per week have gone from 1 million to 2.5 million since then. The ecosystem has matured too, and continues to grow. In this year's Jamstack Conf survey, usage among the community jumped from 14% to 32% while keeping a high 9.7 satisfaction score. We saw the stable releases of Astro 1.0, Nuxt 3, and other Vite-powered frameworks that are innovating and collaborating: SvelteKit, Solid Start, Qwik City. Storybook announced first-class support for Vite as one of its main features for Storybook 7.0. Deno now supports Vite. Vitest adoption is exploding, it will soon represent half of Vite's npm downloads. Nx is also investing in the ecosystem, and officially supports Vite.
As a showcase of the growth Vite and related projects have experienced, the Vite ecosystem gathered on October 11th at ViteConf 2022. We saw representatives from the main web framework and tools tell stories of innovation and collaboration. And in a symbolic move, the Rollup team choose that exact day to release Rollup 3.
Today, the Vite team with the help of our ecosystem partners, is happy to announce the release of Vite 4, powered during build time by Rollup 3. We've worked with the ecosystem to ensure a smooth upgrade path for this new major. Vite is now using Rollup 3, which allowed us to simplify Vite's internal asset handling and has many improvements. See the Rollup 3 release notes here.
Quick links:
Docs
Migration Guide
Changelog
Docs in other languages:
简体中文
日本語
Español
If you recently started using Vite, we suggest reading the Why Vite Guide and checking out the Getting Started and Features guide. If you want to get involved, contributions are welcome at GitHub. Almost 700 collaborators have contributed to Vite. Follow the updates on Twitter and Mastodon, or collaborate with others on our Discord community.
Start playing with Vite 4
Use
pnpm create vite to scaffold a Vite project with your preferred framework, or open a started template online to play with Vite 4 using vite.new.
You can also run
pnpm create vite-extra to get access to templates from other frameworks and runtimes (Solid, Deno, SSR, and library starters).
create vite-extra templates are also available when you run
create vite under the
Others option.
Note that Vite starter templates are intended to be used as a playground to test Vite with different frameworks. When building your next project, we recommend reaching out to the starters recommended by each framework. Some frameworks now redirect in
create vite to their starters too (
create-vue and
Nuxt 3 for Vue, and
SvelteKit for Svelte).
New React plugin using SWC during development
SWC is now a mature replacement for Babel, especially in the context of React projects. SWC's React Fast Refresh implementation is a lot faster than Babel, and for some projects, it is now a better alternative. From Vite 4, two plugins are available for React projects with different tradeoffs. We believe that both approaches are worth supporting at this point, and we'll continue to explore improvements to both plugins in the future.
@vitejs/plugin-react
@vitejs/plugin-react is a plugin that uses esbuild and Babel, achieving fast HMR with a small package footprint and the flexibility of being able to use the Babel transform pipeline.
@vitejs/plugin-react-swc (new)
@vitejs/plugin-react-swc is a new plugin that uses esbuild during build, but replaces Babel with SWC during development. For big projects that don't require non-standard React extensions, cold start and Hot Module Replacement (HMR) can be significantly faster.
Browser Compatibility
The modern browser build now targets
safari14 by default for wider ES2020 compatibility. This means that modern builds can now use
BigInt and that the nullish coalescing operator isn't transpiled anymore. If you need to support older browsers, you can add
@vitejs/plugin-legacy as usual.
Importing CSS as a String
In Vite 3, importing the default export of a
.css file could introduce a double loading of CSS.
import cssString from './global.css'
This double loading could occur since a
.css file will be emitted and it's likely that the CSS string will also be used by the application code — for example, injected by the framework runtime. From Vite 4, the
.css default export has been deprecated. The
?inline query suffix modifier needs to be used in this case, as that doesn't emit the imported
.css styles.
import stuff from './global.css?inline'
Learn more in the Migration Guide.
Environment Variables
Vite now uses
dotenv 16 and
dotenv-expand 9 (previously
dotenv 14 and
dotenv-expand 5). If you have a value including
# or
`, you will need to wrap them with quotes.
-VITE_APP=ab#cd`ef
+VITE_APP="ab#cd`ef"
For more details, see the
dotenv and
dotenv-expand changelog.
Other Features
CLI Shortcuts (press
h during dev to see them all) (#11228)
Support for patch-package when pre bundling dependencies (#10286)
Cleaner build logs output (#10895) and switch to
kB to align with browser dev tools (#10982)
Improved error messages during SSR (#11156)
Reduced Package Size
Vite cares about its footprint, to speed up installation, especially in the use case of playgrounds for documentation and reproductions. And once more, this major brings improvements in Vite's package size. Vite 4 install size is 23% smaller compared to vite 3.2.5 (14.1 MB vs 18.3 MB).
Upgrades to Vite Core
Vite Core and vite-ecosystem-ci continue to evolve to provide a better experience to maintainers and collaborators and to ensure that Vite development scales to cope with the growth in the ecosystem.
Framework plugins out of core
@vitejs/plugin-vue and
@vitejs/plugin-react have been part of Vite core monorepo since the first versions of Vite. This helped us to get a close feedback loop when making changes as we were getting both Core and the plugins tested and released together. With vite-ecosystem-ci we can get this feedback with these plugins developed on independent repositories, so from Vite 4, they have been moved out of the Vite core monorepo. This is meaningful for Vite's framework-agnostic story and will allow us to build independent teams to maintain each of the plugins. If you have bugs to report or features to request, please create issues on the new repositories moving forward:
vitejs/vite-plugin-vue and
vitejs/vite-plugin-react.
vite-ecosystem-ci improvements
vite-ecosystem-ci extends Vite's CI by providing on-demand status reports on the state of the CIs of most major downstream projects. We run vite-ecosystem-ci three times a week against Vite's main branch and receive timely reports before introducing a regression. Vite 4 will soon be compatible with most projects using Vite, which already prepared branches with the needed changes and will be releasing them in the next few days. We are also able to run vite-ecosystem-ci on-demand on PRs using
/ecosystem-ci run in a comment, allowing us to know the effect of changes before they hit main.
Acknowledgments
Vite 4 wouldn't be possible without uncountable hours of work by Vite contributors, many of them maintainers of downstream projects and plugins, and the efforts of the Vite Team. All of us have worked together to improve Vite's DX once more, for every framework and app using it. We're grateful to be able to improve a common base for such a vibrant ecosystem.
We're also thankful to individuals and companies sponsoring the Vite team, and companies investing directly in Vite's future: @antfu7's work on Vite and the ecosystem is part of his job at Nuxt Labs, Astro is funding @bluwyoo's Vite core work, and StackBlitz hires @patak_dev to work full time on Vite.
Next steps
Our immediate focus would be on triaging newly opened issues to avoid disruption by possible regressions. If you would like to get involved and help us improve Vite, we suggest starting with issues triaging. Join our Discord and reach out on the
#contributing channel. Polish our
#docs story, and
#help others. We need to continue to build a helpful and welcoming community for the next wave of users, as Vite's adoption continues to grow.
There are a lot of open fronts to keep improving the DX of everyone that has chosen Vite to power their frameworks and develop their apps. Onwards!
Vite 5.1 is out!
February 8, 2024
Vite 5 was released last November, and it represented another big leap for Vite and the ecosystem. A few weeks ago we celebrated 10 million weekly npm downloads and 900 contributors to the Vite repo. Today, we're excited to announce the release of Vite 5.1.
Quick links: Docs, Changelog
Docs in other languages: 简体中文, 日本語, Español, Português, 한국어, Deutsch
Try Vite 5.1 online in StackBlitz: vanilla, vue, react, preact, lit, svelte, solid, qwik.
If you're new to Vite, we suggest reading first the Getting Started and Features guides.
To stay up to date, follow us on X or Mastodon.
Vite Runtime API
Vite 5.1 adds experimental support for a new Vite Runtime API. It allows running any code by processing it with Vite plugins first. It is different from
server.ssrLoadModule because the runtime implementation is decoupled from the server. This lets library and framework authors implement their own layer of communication between the server and the runtime. This new API is intended to replace Vite's current SSR primitives once it is stable.
The new API brings many benefits:
Support for HMR during SSR.
It is decoupled from the server, so there is no limit on how many clients can use a single server - every client has its own module cache (you can even communicate with it how you want - using message channel/fetch call/direct function call/websocket).
It doesn't depend on any node/bun/deno built-in APIs, so it can run in any environment.
It's easy to integrate with tools that have their own mechanism to run code (you can provide a runner to use
eval instead of
new AsyncFunction for example).
The initial idea was proposed by Pooya Parsa and implemented by Anthony Fu as the vite-node package to power Nuxt 3 Dev SSR and later also used as the base for Vitest. So the general idea of vite-node has been battle-tested for quite some time now. This is a new iteration of the API by Vladimir Sheremet, who had already re-implemented vite-node in Vitest and took the learnings to make the API even more powerful and flexible when adding it to Vite Core. The PR was one year in the makings, you can see the evolution and discussions with ecosystem maintainers here.
::: info
The Vite Runtime API evolved into the Module Runner API, released in Vite 6 as part of the Environment API.
:::
Features
Improved support for
.css?url
Import CSS files as URLs now works reliably and correctly. This was the last remaining hurdle in Remix's move to Vite. See (#15259).
build.assetsInlineLimit now supports a callback
Users can now provide a callback that returns a boolean to opt-in or opt-out of inlining for specific assets. If
undefined is returned, the default logic applies. See (#15366).
Improved HMR for circular import
In Vite 5.0, accepted modules within circular imports always triggered a full page reload even if they can be handled fine in the client. This is now relaxed to allow HMR to apply without a full page reload, but if any error happens during HMR, the page will be reloaded. See (#15118).
Support
ssr.external: true to externalize all SSR packages
Historically, Vite externalizes all packages except for linked packages. This new option can be used to force externalize all packages including linked packages too. This is handy in tests within monorepos where we want to emulate the usual case of all packages externalized, or when using
ssrLoadModule to load an arbitrary file and we want to always external packages as we don't care about HMR. See (#10939).
Expose
close method in the preview server
The preview server now exposes a
close method, which will properly teardown the server including all opened socket connections. See (#15630).
Performance improvements
Vite keeps getting faster with each release, and Vite 5.1 is packed with performance improvements. We measured the loading time for 10K modules (25 level deep tree) using vite-dev-server-perf for all minor versions from Vite 4.0. This is a good benchmark to measure the effect of Vite's bundle-less approach. Each module is a small TypeScript file with a counter and imports to other files in the tree, so this mostly measures the time it takes to do the requests as separate modules. In Vite 4.0, loading 10K modules took 8 seconds on a M1 MAX. We had a breakthrough in Vite 4.3 where we focused on performance, and we were able to load them in 6.35 seconds. In Vite 5.1, we managed to do another performance leap. Vite is now serving the 10K modules in 5.35 seconds.
The results of this benchmark run on Headless Puppeteer and are a good way to compare versions. They don't represent the time as experienced by users though. When running the same 10K modules in an Incognito window in Chrome, we have:
10K Modules
Vite 5.0
Vite 5.1
Loading time
2892ms
2765ms
Loading time (cached)
2778ms
2477ms
Full reload
2003ms
1878ms
Full reload (cached)
1682ms
1604ms
Run CSS preprocessors in threads
Vite now has opt-in support for running CSS preprocessors in threads. You can enable it using
css.preprocessorMaxWorkers: true. For a Vuetify 2 project, dev startup time was reduced by 40% with this feature enabled. There is performance comparison for others setups in the PR. See (#13584). Give Feedback.
New options to improve server cold starts
You can set
optimizeDeps.holdUntilCrawlEnd: false to switch to a new strategy for deps optimization that may help in big projects. We're considering switching to this strategy by default in the future. Give Feedback. (#15244)
Faster resolving with cached checks
The
fs.cachedChecks optimization is now enabled by default. In Windows,
tryFsResolve was ~14x faster with it, and resolving ids overall got a ~5x speed up in the triangle benchmark. (#15704)
Internal performance improvements
The dev server had several incremental performance gains. A new middleware to short-circuit on 304 (#15586). We avoided
parseRequest in hot paths (#15617). Rollup is now properly lazy loaded (#15621)
Deprecations
We continue to reduce Vite's API surface where possible to make the project maintainable long term.
Deprecated
as option in
import.meta.glob
The standard moved to Import Attributes, but we don't plan to replace
as with a new option at this point. Instead, it is recommended that the user switches to
query. See (#14420).
Removed experimental build-time pre-bundling
Build-time pre-bundling, an experimental feature added in Vite 3, is removed. With Rollup 4 switching its parser to native, and Rolldown being worked on, both the performance and the dev-vs-build inconsistency story for this feature are no longer valid. We want to continue improving dev/build consistency, and have concluded that using Rolldown for "prebundling during dev" and "production builds" is the better bet moving forward. Rolldown may also implement caching in a way that is a lot more efficient during build than deps prebundling. See (#15184).
Get Involved
We are grateful to the 900 contributors to Vite Core, and the maintainers of plugins, integrations, tools, and translations that keeps pushing the ecosystem forward. If you're enjoying Vite, we invite you to participate and help us. Check out our Contributing Guide, and jump into triaging issues, reviewing PRs, answering questions at GitHub Discussions and helping others in the community in Vite Land.
Acknowledgments
Vite 5.1 is possible thanks to our community of contributors, maintainers in the ecosystem, and the Vite Team. A shout out to the individuals and companies sponsoring Vite development. StackBlitz, Nuxt Labs, and Astro for hiring Vite team members. And also to the sponsors on Vite's GitHub Sponsors, Vite's Open Collective, and Evan You's GitHub Sponsors.
Vite 5.0 is out!
November 16, 2023
Vite 4 was released almost a year ago, and it served as a solid base for the ecosystem. npm downloads per week jumped from 2.5 million to 7.5 million, as projects keep building on a shared infrastructure. Frameworks continued to innovate, and on top of Astro, Nuxt, SvelteKit, Solid Start, Qwik City, between others, we saw new frameworks joining and making the ecosystem stronger. RedwoodJS and Remix switching to Vite paves the way for further adoption in the React ecosystem. Vitest kept growing at an even faster pace than Vite. Its team has been hard at work and will soon release Vitest 1.0. The story of Vite when used with other tools such as Storybook, Nx, and Playwright kept improving, and the same goes for environments, with Vite dev working both in Deno and Bun.
We had the second edition of ViteConf a month ago, hosted by StackBlitz. Like last year, most of the projects in the ecosystem got together to share ideas and connect to keep expanding the commons. We're also seeing new pieces complement the meta-framework tool belt like Volar and Nitro. The Rollup team released Rollup 4 that same day, a tradition Lukas started last year.
Six months ago, Vite 4.3 was released. This release significantly improved the dev server performance. However, there is still ample room for improvement. At ViteConf, Evan You unveiled Vite's long-term plan to work on Rolldown, a Rust-port of Rollup with compatible APIs. Once it is ready, we intend to use it in Vite Core to take on the tasks of both Rollup and esbuild. This will mean a boost in build performance (and later on in dev performance too as we move perf-sensitive parts of Vite itself to Rust), and a big reduction of inconsistencies between dev and build. Rolldown is currently in early stages and the team is preparing to open source the codebase before the end of the year. Stay tuned!
Today, we mark another big milestone in Vite's path. The Vite team, contributors, and ecosystem partners, are excited to announce the release of Vite 5. Vite is now using Rollup 4, which already represents a big boost in build performance. And there are also new options to improve your dev server performance profile.
Vite 5 focuses on cleaning up the API (removing deprecated features) and streamlines several features closing long-standing issues, for example switching
define to use proper AST replacements instead of regexes. We also continue to take steps to future-proof Vite (Node.js 18+ is now required, and the CJS Node API has been deprecated).
Quick links:
Docs
Migration Guide
Changelog
Docs in other languages:
简体中文
日本語
Español
Português
한국어
Deutsch (new translation!)
If you're new to Vite, we suggest reading first the Getting Started and Features guides.
We appreciate the more than 850 contributors to Vite Core, and the maintainers and contributors of Vite plugins, integrations, tools, and translations that have helped us reach here. We encourage you to get involved and continue to improve Vite with us. You can learn more at our Contributing Guide. To get started, we recommend triaging issues, reviewing PRs, sending failing tests PRs based on open issues, and helping others in Discussions and Vite Land's help forum. You'll learn a lot along the way and have a smooth path to further contributions to the project. If you have doubts, join us on our Discord community and say hi on the #contributing channel.
To stay up to date, follow us on X or Mastodon.
Quick start with Vite 5
Use
pnpm create vite to scaffold a Vite project with your preferred framework, or open a started template online to play with Vite 5 using vite.new. You can also run
pnpm create vite-extra to get access to templates from other frameworks and runtimes (Solid, Deno, SSR, and library starters).
create vite-extra templates are also available when you run
create vite under the
Others option.
Note that Vite starter templates are intended to be used as a playground to test Vite with different frameworks. When building your next project, we recommend reaching out to the starters recommended by each framework. Some frameworks now redirect in
create vite to their starters too (
create-vue and
Nuxt 3 for Vue, and
SvelteKit for Svelte).
Node.js Support
Vite no longer supports Node.js 14 / 16 / 17 / 19, which reached its EOL. Node.js 18 / 20+ is now required.
Performance
On top of Rollup 4's build performance improvements, there is a new guide to help you identify and fix common performance issues at https://vite.dev/guide/performance.
Vite 5 also introduces server.warmup, a new feature to improve startup time. It lets you define a list of modules that should be pre-transformed as soon as the server starts. When using
--open or
server.open, Vite will also automatically warm up the entry point of your app or the provided URL to open.
Main Changes
Vite is now powered by Rollup 4
The CJS Node API has been deprecated
Rework
define and
import.meta.env.* replacement strategy
SSR externalized modules value now matches production
worker.plugins is now a function
Allow path containing
. to fallback to index.html
Align dev and preview HTML serving behavior
Manifest files are now generated in
.vite directory by default
CLI shortcuts require an additional
Enter press
Update
experimentalDecorators and
useDefineForClassFields TypeScript behavior
Remove
--https flag and
https: true
Remove
resolvePackageEntry and
resolvePackageData APIs
Removes previously deprecated APIs
Read more about advanced changes affecting plugin and tool authors
Migrating to Vite 5
We have worked with ecosystem partners to ensure a smooth migration to this new major. Once again, vite-ecosystem-ci has been crucial to help us make bolder changes while avoiding regressions. We're thrilled to see other ecosystems adopt similar schemes to improve the collaboration between their projects and downstream maintainers.
For most projects, the update to Vite 5 should be straight forward. But we advise reviewing the detailed Migration Guide before upgrading.
A low level breakdown with the full list of changes to Vite core can be found at the Vite 5 Changelog.
Acknowledgments
Vite 5 is the result of long hours of work by our community of contributors, downstream maintainers, plugins authors, and the Vite Team. A big shout out to Bjorn Lu for leading the release process for this major.
We're also thankful to individuals and companies sponsoring Vite development. StackBlitz, Nuxt Labs, and Astro continue to invest in Vite by hiring Vite team members. A shout out to sponsors on Vite's GitHub Sponsors, Vite's Open Collective, and Evan You's GitHub Sponsors. A special mention to Remix for becoming a Gold sponsor and contributing back after switching to Vite.
Vite 6.0 is out!
November 26, 2024
Today, we're taking another big step in Vite's story. The Vite team, contributors, and ecosystem partners are excited to announce the release of Vite 6.
It has been an eventful year. Vite adoption keeps growing, with npm downloads per week jumping from 7.5 million to 17 million since the release of Vite 5 a year ago. Vitest is not only being favored more by users but is also starting to form an ecosystem of its own. For example, Storybook has new testing capabilities powered by Vitest.
New frameworks have also joined the Vite ecosystem, including TanStack Start, One, Ember, and others. Web frameworks are innovating at an increasingly faster pace. You can check out the improvements folks have been doing at Astro, Nuxt, SvelteKit, Solid Start, Qwik City, RedwoodJS, React Router, and the list goes on.
Vite is used by OpenAI, Google, Apple, Microsoft, NASA, Shopify, Cloudflare, GitLab, Reddit, Linear, among many others. Two months ago, we started a list of companies using Vite. We're happy to see many developers sending us a PR to add their companies to the list. It's hard to believe how much the ecosystem we built together has grown since Vite gave its first steps.
Speeding up the Vite ecosystem
Last month, the community gathered for the third edition of ViteConf, hosted once more by StackBlitz. It was the biggest Vite conference, with a broad representation of builders from the ecosystem. Among other announcements, Evan You announced VoidZero, a company dedicated to building an open-source, high-performance, and unified development toolchain for the JavaScript ecosystem. VoidZero is behind Rolldown and Oxc, and their team is making significant strides, getting them rapidly ready for being adopted by Vite. Watch Evan's keynote to learn more about the next steps for Vite's rust-powered future.
Stackblitz unveiled bolt.new, a Remix app that combines Claude and WebContainers and lets you prompt, edit, run, and deploy full-stack apps. Nate Weiner announced One, a new Vite-powered React framework for web and native. Storybook showcased their latest Vitest-powered testing features. And so much more. We encourage you to watch all 43 talks. The speakers made a significant effort to share with us what each project has been up to.
Vite also got a refreshed landing page and a clean domain. You should update your URLs to point to the new vite.dev domain moving forward. The new design and implementation was done by VoidZero, by the same folks that made their website. Shoutout to Vicente Rodriguez and Simon Le Marchant.
The next Vite major is here
Vite 6 is the most significant major release since Vite 2. We're eager to partner with the ecosystem to keep expanding our shared commons through new APIs and, as usual, a more polished base upon which to build.
Quick links:
Docs
Translations: 简体中文, 日本語, Español, Português, 한국어, Deutsch
Migration Guide
GitHub Changelog
If you're new to Vite, we suggest reading the Getting Started and Features guides first.
We want to thank the more than 1K contributors to Vite Core and the maintainers and contributors of Vite plugins, integrations, tools, and translations that have helped us craft this new major. We invite you to get involved and help us improve Vite for the whole ecosystem. Learn more at our Contributing Guide.
To get started, we suggest helping triage issues, review PRs, send failing tests PRs based on open issues, and support others in Discussions and Vite Land's help forum. If you'd like to talk to us, join our Discord community and say hi on the #contributing channel.
For the latest news about the Vite ecosystem and Vite core, follow us on Bluesky, X, or Mastodon.
Getting started with Vite 6
You can use
pnpm create vite to quickly scaffold a Vite app with your preferred framework or play online with Vite 6 using vite.new. You can also run
pnpm create vite-extra to get access to templates from other frameworks and runtimes (Solid, Deno, SSR, and library starters).
create vite-extra templates are also available when you run
create vite under the
Others option.
The Vite starter templates are intended to be used as a playground to test Vite with different frameworks. When building your next project, you should reach out to the starter recommended by each framework.
create vite also provides a shortcut to setup proper starters by some frameworks, like
create-vue,
Nuxt 3,
SvelteKit,
Remix,
Analog, and
Angular.
Node.js Support
Vite 6 supports Node.js 18, 20, and 22+, similar to Vite 5. Node.js 21 support has been dropped. Vite drops Node.js support for older versions after their EOL. The Node.js 18 EOL is at the end of April 2025, after which we may release a new major to bump the required Node.js version.
Experimental Environment API
Vite is getting more flexible with the new Environment API. These new APIs will allow framework authors to offer a dev experience closer to production and for the Ecosystem to share new building blocks. Nothing changes if you're building a SPA; when you use Vite with a single client environment, everything works as before. And even for custom SSR apps, Vite 6 is backward compatible. The primary target audience for Environment API is framework authors.
For end users who are curious, Sapphi wrote a great Introduction to Environment API guide. It is a great place to start and understand why we're trying to make Vite even more flexible.
If you are a framework author or Vite plugin maintainer and would like to leverage the new APIs, you can learn more at the Environment API Guides.
We want to thank everyone involved in defining and implementing the new APIs. The story begins with Vite 2 adopting the unbundled SSR dev scheme pioneered by Rich Harris and the SvelteKit team. Vite's SSR transform then unlocked Anthony Fu and Pooya Parsa to create vite-node and improve Nuxt's Dev SSR story. Anthony went to use vite-node to power Vitest, and Vladimir Sheremet kept improving it as part of his work maintaining Vitest. At the beginning of 2023, Vladimir started working to upstream vite-node to Vite Core, and we released it as Runtime API in Vite 5.1 a year later. Feedback from ecosystem partners (special shout-out to the Cloudflare team) pushed us to do a more ambitious rework of Vite's environments. You can learn more about the story at Patak's ViteConf 24 talk.
Everyone on the Vite team participated in defining the new API, which was co-designed with feedback from many projects in the Ecosystem. Thanks to everyone involved! We encourage you to get involved if you're building a framework, plugin, or tool on top of Vite. The new APIs are experimental. We will work with the Ecosystem to review how the new APIs will be used and stabilize them for the next major. If you'd like to ask questions or give feedback, there is an open GitHub discussion here.
Main Changes
Default value for
resolve.conditions
JSON stringify
Extended support of asset references in HTML elements
postcss-load-config
Sass now uses modern API by default
Customize CSS output file name in library mode
And more changes that should only affect a few users
There is also a new Breaking Changes page that lists all planned, considering, and past changes in Vite.
Migrating to Vite 6
For most projects, the update to Vite 6 should be straightforward, but we advise reviewing the detailed Migration Guide before upgrading.
The complete list of changes is at the Vite 6 Changelog.
Acknowledgments
Vite 6 results from long work hours by our community of contributors, downstream maintainers, plugin authors, and the Vite Team. We appreciate the individuals and companies sponsoring Vite development. Vite is brought to you by VoidZero, in partnership with StackBlitz, Nuxt Labs, and Astro. A shout-out to sponsors on Vite's GitHub Sponsors and Vite's Open Collective.
Vite 7.0 is out!
June 24, 2025
We're happy to share the release of Vite 7! It has been 5 years since Evan You sent the first commit to the Vite repo, and nobody could have predicted how much the frontend ecosystem would change since then. Most modern frontend frameworks and tools are now working together, building on top of Vite's shared infrastructure. And they can innovate at a faster pace by sharing at a higher level. Vite is now being downloaded 31 million times a week, with a 14 million increase in the last seven months since the previous major release.
This year, we're making several big steps. To start with, ViteConf is going to be in person! The Vite Ecosystem will gather in Amsterdam on October 9-10! Organized by JSWorld in partnership with Bolt, VoidZero, and the Vite Core Team! We had three incredible ViteConf online editions, and we can't wait to meet in real life. Check out the speakers and get your ticket at the ViteConf site!
And VoidZero continues to make significant strides in its mission to build an open source unified development toolchain for the JavaScript ecosystem. Over the last year, the VoidZero team has been working on Rolldown, a Rust-based next-generation bundler, as part of a broader effort to modernize Vite's core. You can try out the Rolldown-powered Vite today by using the
rolldown-vite package instead of the default
vite package. It is a drop-in replacement, as Rolldown will become the default bundler for Vite in the future. Switching should reduce your build time, especially for larger projects. Read more at the Rolldown-vite announcement blog post and our migration guide.
Through a partnership between VoidZero and NuxtLabs, Anthony Fu is working on creating Vite DevTools. They will offer deeper and more insightful debugging and analysis for all Vite-based projects and frameworks. You can read more on the VoidZero and NuxtLabs join forces on Vite Devtools blog post.
Quick links:
Docs
New Translation: فارسی
Other Translations: 简体中文, 日本語, Español, Português, 한국어, Deutsch
Migration Guide
GitHub Changelog
Play online with Vite 7 using vite.new or scaffold a Vite app locally with your preferred framework running
pnpm create vite. Check out the Getting Started Guide for more information.
We invite you to help us improve Vite (joining the more than 1.1K contributors to Vite Core), our dependencies, or plugins and projects in the ecosystem. Learn more at our Contributing Guide. A good way to get started is by triaging issues, reviewing PRs, sending tests PRs based on open issues, and supporting others in Discussions or Vite Land's help forum. If you have questions, join our Discord community and talk to us in the #contributing channel.
Stay updated and connect with others building on top of Vite by following us on Bluesky, X, or Mastodon.
Node.js Support
Vite now requires Node.js 20.19+, 22.12+. We have dropped Node.js 18, now that it has reached its EOL at the end of April 2025.
We require these new ranges so Node.js supports
require(esm) without a flag. This allows us to distribute Vite 7.0 as ESM only without preventing the Vite JavaScript API from being required by CJS modules. Check out Anthony Fu's Move on to ESM-only for a detailed review of the current state of ESM in the ecosystem.
Default Browser Target Changed to Baseline Widely Available
Baseline gives us clear information about which web platform features work across their core browser set today. Baseline Widely Available indicates the feature is well-established and works across many devices and browser versions, being available across browsers for at least 30 months.
In Vite 7, the default browser target is changing from
'modules' to a new default:
'baseline-widely-available'. The set of browsers will be updated on each major to match the list of minimum browser versions compatible with Baseline Widely available features. The default browser value of
build.target is changing in Vite 7.0:
Chrome 87 → 107
Edge 88 → 107
Firefox 78 → 104
Safari 14.0 → 16.0
This change adds predictability to the default browser target for future releases.
Vitest
For Vitest users, Vite 7.0 is supported from Vitest 3.2. You can read more about how the Vitest team keeps improving Vite testing story in the Vitest 3.2 release blog post.
Environment API
Vite 6 was the most significant major release since Vite 2, adding new capabilities with the new experimental Environment API. We are keeping the new APIs as experimental while the ecosystem reviews how the new APIs fit on their projects and provide feedback. If you're building on top of Vite, we encourage you to test the new APIs and reach out to us in the open Feedback discussion here.
In Vite 7, we added a new
buildApp hook to let plugins coordinate the building of environments. Read more in the Environment API for Frameworks guide.
We want to thank the teams that have been testing the new APIs and helping us stabilize the new features. The Cloudflare team, for example, announced the 1.0 release of their Cloudflare Vite plugin, as well as official support for React Router v7. Their plugin shows the potential of Environment API for runtime providers. Learn more about their approach and future steps at "Just use Vite”… with the Workers runtime.
Migrating to Vite 7
Vite 7 should be a smooth update from Vite 6. We're removing already deprecated features, like Sass legacy API support and the
splitVendorChunkPlugin that shouldn't affect your projects. We still suggest you review the detailed Migration Guide before upgrading.
The complete list of changes is at the Vite 7 Changelog.
Acknowledgments
Vite 7 was crafted by the Vite Team with the help of the wide community of contributors, downstream maintainers, plugin authors. A special shout-out to sapphi-red for his remarkable work on
rolldown-vite and this release. Vite is brought to you by VoidZero, in partnership with Bolt and Nuxt Labs. We also want to thank our sponsors on Vite's GitHub Sponsors and Vite's Open Collective.
Vite 8.1 is out!
June 23, 2026
Vite 8 was released in March with a single unified bundler powered by Rolldown, opening the door to further improvements. It is now seeing 41.6 million weekly downloads, almost reaching the total downloads of Vite 7. Alongside resolving upgrade regressions, we've been working on new features, and we're excited to announce the release of Vite 8.1.
Quick links:
Docs
Translations: 简体中文, 日本語, Español, Português, 한국어, Deutsch, فارسی
GitHub Changelog
Play online with Vite 8.1 using vite.new or scaffold a Vite app locally with your preferred framework running
pnpm create vite. Check out the Getting Started Guide for more information.
We invite you to help us improve Vite (joining the more than 1.2K contributors to Vite Core), our dependencies, or plugins and projects in the ecosystem. Learn more at our Contributing Guide. A good way to get started is by triaging issues, reviewing PRs, sending tests PRs based on open issues, and supporting others in Discussions or Vite Land's help forum. If you have questions, join our Discord community and talk to us in the #contributing channel.
Stay updated and connect with others building on top of Vite by following us on Bluesky, X, or Mastodon.
Features
Experimental Bundled Dev Mode
Experimental support for bundled dev mode is now available. This was previously called as "Full Bundle Mode". This mode is to improve performance of huge applications that suffer from the number of modules.
In our initial testing with an app loading 10,000 React components, bundled dev mode achieved around 15x faster startup and 10x faster full page reloads compared to the unbundled dev server, while keeping HMR instant regardless of the application size. Early testing on real-world applications shows similar gains: the Linear team saw cold start rendering up to 3x faster, full reloads around 40% faster, and 10x fewer network requests.
::: details Why bundled dev mode?
Vite is known for its unbundled dev server approach, which is a main reason for Vite's speed and popularity when it was first introduced. This approach was initially an experiment to see just how far we could push the boundaries of development server performance without traditional bundling.
However, as projects scale in size and complexity, it has become clear that Vite's unbundled dev approach can degrade performance during development. Because each module is fetched separately, the browser must process a large number of requests, which increases startup and refresh overhead. This impact is especially noticeable in large applications and becomes more severe when developers are behind a network proxy, resulting in slower refresh times and a worse developer experience.
Bundled Dev Mode would allow serving bundled files not only in production but also during development, combining the best of both worlds:
Fast startup times even for large applications
Reduced network overhead on page refreshes
Maintained efficient HMR on top of ESM output
:::
Currently, it focuses on the browser side and the basic plugins and the main features. If you are using a third party plugin, it may not work with this mode. If you are using a minor feature, it may not work as well. We are working on expanding the support and preparing a document that clarifies the changes that may be needed on the plugin side. See the design document for more details about the roadmap.
To enable this mode, you can pass
--experimental-bundle or add
experimental.bundledDev: true to your
vite.config.js:
import { defineConfig } from 'vite'
export default defineConfig({
experimental: {
bundledDev: true,
},
})
Share your feedback in the discussion.
Experimental Chunk Import Map
In the output bundle, the import statement of a chunk includes the hash of that chunk. This is to ensure the new chunk is loaded if the chunk content has changed. However, this also causes the hash of the chunk importing the changed chunk to change, cascading the change to all the chunks that import the changed chunk transitively.
digraph chunk_hash_cascade {
rankdir=TB
node [shape=box style="rounded,filled" fontname="Arial" fontsize=11 margin="0.25,0.12" fontcolor="${#3c3c43|#ffffff}" color="${#c2c2c4|#3c3f44}"]
edge [color="${#67676c|#98989f}" fontname="Arial" fontsize=10 fontcolor="${#67676c|#98989f}"]
bgcolor="transparent"
utils [label="utils.[e5f6 → 88xx].js\ncontent edited" fillcolor="${#fcf4dc|#38301a}" color="${#e0a800|#d4a72c}"]
page [label="page.[c3d4 → 77yy].js\nre-hashed by cascade" fillcolor="${#fde8e8|#3a1f22}" color="${#d5393e|#f66f81}"]
entry [label="entry.[a1b2 → 99zz].js\nre-hashed by cascade" fillcolor="${#fde8e8|#3a1f22}" color="${#d5393e|#f66f81}"]
entry -> page [label=" imports (embeds hash)\l" color="${#d5393e|#f66f81}" fontcolor="${#d5393e|#f66f81}"]
page -> utils [label=" imports (embeds hash)\l" color="${#d5393e|#f66f81}" fontcolor="${#d5393e|#f66f81}"]
}
The experimental chunk import map feature solves this problem utilizing import maps and improves the cache efficiency. This feature is built on top of Rolldown's feature, but adds the support for Vite specific features. Huge thanks to Taisei Mima for their research and initial implementation of this feature!
Note that
experimental.renderBuiltUrl currently does not work with this option.
See the guide and the option docs for more details. Share your feedback in the discussion.
Wasm ESM integration Support
Wasm ESM integration proposal is now supported in Vite. You can now import wasm files and use the exported functions directly:
import { add } from './add.wasm'
console.log(add(1, 2)) // 3
Huge thanks to Menci for their creation and maintenance of vite-plugin-wasm while the proposal was early stages and also for upstreaming the implementation to Vite core!
See the guide for more details.
One step closer to use Lightning CSS by default
We have worked with the Lightning CSS team to add features that was supported by PostCSS but was lacking in Lightning CSS. Vite 8.1 now has these two features:
Allow external CSS files imported in CSS files (lightningcss#479)
Register file dependencies by plugins (lightningcss#877)
We are thinking of changing the default CSS preprocessor to Lightning CSS in the next major release. Please try it out by
css.transformer: 'lightningcss' and share your feedback in the discussion.
Case Insensitive Matching For
import.meta.glob
import.meta.glob now supports
caseSensitive option to match files case insensitively.
// matches ./dir/Module1.js
const modules = import.meta.glob('./dir/module*.js', {
caseSensitive: false,
})
Asset Discovery For Custom HTML Elements And Attributes
Previously, Vite would only discover assets for the elements and attributes that was pre-defined. Now, you can use the
html.additionalAssetSources option to add more elements and attributes.
import { defineConfig } from 'vite'
export default defineConfig({
html: {
additionalAssetSources: {
'html-import': {
srcAttributes: ['src'],
},
img: {
srcAttributes: ['data-src-dark', 'data-src-light'],
},
},
},
})
Other Changes
Check out the Changelog for other features and bug fixes.
Acknowledgments
Vite 8.1 is possible thanks to our community of contributors, maintainers in the ecosystem, and the Vite Team. Vite is brought to you by VoidZero, in partnership with Bolt and Nuxt Labs. We also want to thank our sponsors on Vite's GitHub Sponsors and Vite's Open Collective.
Vite 8 Beta: The Rolldown-powered Vite
December 3, 2025
TL;DR: The first beta of Vite 8, powered by Rolldown, is now available. Vite 8 ships significantly faster production builds and unlocks future improvement possibilities. You can try the new release by upgrading
vite to version
8.0.0-beta.0 and reading the migration guide.
We're excited to release the first beta of Vite 8. This release unifies the underlying toolchain and brings better consistent behaviors, alongside significant build performance improvements. Vite now uses Rolldown as its bundler, replacing the previous combination of esbuild and Rollup.
A new bundler for the web
Vite previously relied on two bundlers to meet differing requirements for development and production builds:
esbuild for fast compilation during development
Rollup for bundling, chunking, and optimizing production builds
This approach lets Vite focus on developer experience and orchestration instead of reinventing parsing and bundling. However, maintaining two separate bundling pipelines introduced inconsistencies: separate transformation pipelines, different plugin systems and a growing amount of glue code to keep bundling behavior aligned between development and production.
To solve this, VoidZero team has built Rolldown, the next-generation bundler with the goal to be used in Vite. It is designed for:
Performance: Rolldown is written in Rust and operates at native speed. It matches esbuild’s performance level and is 10–30× faster than Rollup.
Compatibility: Rolldown supports the same plugin API as Rollup and Vite. Most Vite plugins work out of the box with Vite 8.
More Features: Rolldown unlocks more advanced features for Vite, including full bundle mode, more flexible chunk split control, module-level persistent cache, Module Federation, and more.
Unifying the toolchain
The impact of Vite’s bundler swap goes beyond performance. Bundlers leverage parsers, resolvers, transformers, and minifiers. Rolldown uses Oxc, another project led by VoidZero, for these purposes.
That makes Vite the entry point to an end-to-end toolchain maintained by the same team: The build tool (Vite), the bundler (Rolldown) and the compiler (Oxc).
This alignment ensures behavior consistency across the stack, and allows us to rapidly adopt and align with new language specifications as JavaScript continues to evolve. It also unlocks a wide range of improvements that previously couldn’t be done by Vite alone. For example, we can leverage Oxc’s semantic analysis to perform better tree-shaking in Rolldown.
How Vite migrated to Rolldown
The migration to a Rolldown-powered Vite is a foundational change. Therefore, our team took deliberate steps to implement it without sacrificing stability or ecosystem compatibility.
First, a separate
rolldown-vite package was released as a technical preview. This allowed us to work with early adopters without affecting the stable version of Vite. Early adopters benefited from Rolldown’s performance gains while providing valuable feedback. Highlights:
Linear's production build times were reduced from 46s to 6s
Ramp reduced their build time by 57%
Mercedes-Benz.io cut their build time down by up to 38%
Beehiiv reduced their build time by 64%
Next, we set up a test suite for validating key Vite plugins against
rolldown-vite. This CI job helped us catch regressions and compatibility issues early, especially for frameworks and meta-frameworks such as SvelteKit, react-router and Storybook.
Lastly, we built a compatibility layer to help migrate developers from Rollup and esbuild options to the corresponding Rolldown options.
As a result, there is a smooth migration path to Vite 8 for everyone.
Migrating to Vite 8 Beta
Since Vite 8 touches the core build behavior, we focused on keeping the configuration API and plugin hooks unchanged. We created a migration guide to help you upgrade.
There are two available upgrade paths:
Direct Upgrade: Update
vite in
package.json and run the usual dev and build commands.
Gradual Migration: Migrate from Vite 7 to the
rolldown-vite package, and then to Vite 8. This allows you to identify incompatibilities or issues isolated to Rolldown without other changes to Vite. (Recommended for larger or complex projects)
[!IMPORTANT]
If you are relying on specific Rollup or esbuild options, you might need to make some adjustments to your Vite config. Please refer to the migration guide for detailed instructions and examples.
As with all non-stable, major releases, thorough testing is recommended after upgrading to ensure everything works as expected. Please make sure to report any issues.
If you use a framework or tool that uses Vite as dependency, for example Astro, Nuxt, or Vitest, you have to override the
vite dependency in your
package.json, which works slightly different depending on your package manager:
:::code-group
{
"overrides": {
"vite": "8.0.0-beta.0"
}
}
{
"resolutions": {
"vite": "8.0.0-beta.0"
}
}
{
"pnpm": {
"overrides": {
"vite": "8.0.0-beta.0"
}
}
}
{
"overrides": {
"vite": "8.0.0-beta.0"
}
}
:::
After adding these overrides, reinstall your dependencies and start your development server or build your project as usual.
Additional Features in Vite 8
In addition to shipping with Rolldown, Vite 8 comes with:
Built-in tsconfig
paths support: Developers can enable it by setting
resolve.tsconfigPaths to
true. This feature has a small performance cost and is not enabled by default.
emitDecoratorMetadata support: Vite 8 now has built-in automatic support for TypeScript's
emitDecoratorMetadata option. See the Features page for more details.
Looking Ahead
Speed has always been a defining feature for Vite. The integration with Rolldown and, by extension, Oxc means JavaScript developers benefit from Rust’s speed. Upgrading to Vite 8 should result in performance gains simply from using Rust.
We are also excited to ship Vite’s Full Bundle Mode soon, which drastically improves Vite’s dev server speed for large projects. Preliminary results show 3× faster dev server startup, 40% faster full reloads, and 10× fewer network requests.
Another defining Vite feature is the plugin ecosystem. We want JavaScript developers to continue extending and customizing Vite in JavaScript, the language they’re familiar with, while benefiting from Rust’s performance gains. Our team is collaborating with VoidZero team to accelerate JavaScript plugin usage in these Rust-based systems.
Upcoming optimizations that are currently experimental:
Raw AST transfer. Allow JavaScript plugins to access the Rust-produced AST with minimal overhead.
Native MagicString transforms. Simple custom transforms with logic in JavaScript but computation in Rust.
Connect with us
If you've tried Vite 8 beta, then we'd love to hear your feedback! Please report any issues or share your experience:
Discord: Join our community server for real-time discussions
GitHub: Share feedback on GitHub discussions
Issues: Report issues on the rolldown-vite repository for bugs and regressions
Wins: Share your improved build times in the rolldown-vite-perf-wins repository
We appreciate all reports and reproduction cases. They help guide us towards the release of a stable 8.0.0.
Vite 8.0 is out!
March 12, 2026
We're thrilled to announce the stable release of Vite 8! When Vite first launched, we made a pragmatic bet on two bundlers: esbuild for speed during development, and Rollup for optimized production builds. That bet served us well for years. We're very grateful to the Rollup and esbuild maintainers. Vite wouldn't have succeeded without them. Today, it resolves into one: Vite 8 ships with Rolldown as its single, unified, Rust-based bundler, delivering up to 10-30x faster builds while maintaining full plugin compatibility. This is the most significant architectural change since Vite 2.
Vite is now being downloaded 65 million times a week, and the ecosystem continues to grow with every release. To help developers navigate the ever-expanding plugin landscape, we also launched registry.vite.dev, a searchable directory of plugins for Vite, Rolldown, and Rollup that collects plugin data from npm daily.
Quick links:
Docs
Translations: 简体中文, 日本語, Español, Português, 한국어, Deutsch, فارسی
Migration Guide
GitHub Changelog
Play online with Vite 8 using vite.new or scaffold a Vite app locally with your preferred framework running
pnpm create vite. Check out the Getting Started Guide for more information.
We invite you to help us improve Vite (joining the more than 1.2K contributors to Vite Core), our dependencies, or plugins and projects in the ecosystem. Learn more at our Contributing Guide. A good way to get started is by triaging issues, reviewing PRs, sending tests PRs based on open issues, and supporting others in Discussions or Vite Land's help forum. If you have questions, join our Discord community and talk to us in the #contributing channel.
Stay updated and connect with others building on top of Vite by following us on Bluesky, X, or Mastodon.
The Rolldown-Powered Vite
The problem
Since its earliest versions, Vite relied on two separate bundlers to serve different needs. esbuild handled fast compilation during development (dependency pre-bundling and TypeScript/JSX transforms) that made the dev experience feel instant. Rollup handled production bundling, chunking, and optimization, with its rich plugin API powering the entire Vite plugin ecosystem.
This dual-bundler approach served Vite well for years. It allowed us to focus on developer experience and orchestration rather than reinventing parsing and bundling from scratch. But it came with trade-offs. Two separate transformation pipelines meant two separate plugin systems, and an increasing amount of glue code needed to keep the two pipelines in sync. Edge cases around inconsistent module handling accumulated over time, and every alignment fix in one pipeline risked introducing differences in the other.
The solution
Rolldown is a Rust-based bundler built by the VoidZero team to address these challenges head-on. It was designed with three goals:
Performance: Written in Rust, Rolldown operates at native speed. In benchmarks, it is 10-30x faster than Rollup matching esbuild's performance level.
Compatibility: Rolldown supports the same plugin API as Rollup and Vite. Most existing Vite plugins work out of the box with Vite 8.
Advanced features: A single unified bundler unlocks capabilities that were difficult or impossible with the dual-bundler setup, including full bundle mode, more flexible chunk splitting, module-level persistent caching, and Module Federation support.
The journey to stable
The migration to Rolldown was deliberate and community-driven. First, a separate
rolldown-vite package was released as a technical preview, allowing early adopters to test Rolldown's integration without affecting the stable version of Vite. The feedback from those early adopters was invaluable. They pushed the integration through real-world codebases of every shape and size, surfacing edge cases and compatibility issues we could address before a wider release. We also set up a dedicated CI suite validating key Vite plugins and frameworks against the new bundler, catching regressions early and building confidence in the migration path.
In December 2025, we shipped the Vite 8 beta with Rolldown fully integrated. During the beta period, Rolldown itself progressed from beta to a release candidate, with continuous improvements driven by the testing and feedback of the Vite community.
Real-world performance
During the preview and beta phases of
rolldown-vite, several companies reported measurable reductions in production build times:
Linear: Production build times dropped from 46s to 6s
Ramp: 57% build time reduction
Mercedes-Benz.io: Up to 38% build time reduction
Beehiiv: 64% build time reduction
For large projects, the impact can be especially noticeable, and we expect further improvements as Rolldown continues to evolve.
A unified toolchain
With Vite 8, Vite becomes the entry point to an end-to-end toolchain with closely collaborating teams: the build tool (Vite), the bundler (Rolldown), and the compiler (Oxc). This alignment ensures consistent behavior across the entire stack, from parsing and resolving to transforming and minifying. It also means we can rapidly adopt new language specifications as JavaScript evolves. And by integrating deeply across layers, we can pursue optimizations that were previously out of reach, such as leveraging Oxc's semantic analysis for better tree-shaking in Rolldown.
Thank you to the community
None of this would have been possible without the broader community. We want to extend our deep thanks to the framework teams (SvelteKit, React Router, Storybook, Astro, Nuxt, and many others) who tested
rolldown-vite early, filed detailed bug reports, and worked with us to resolve compatibility issues. We are equally grateful to every developer who tried the beta, shared their build time improvements, and reported the rough edges that helped us polish this release. Your willingness to test the migration on real projects helped make the transition to Rolldown smoother and more reliable.
Node.js Support
Vite 8 requires Node.js 20.19+, 22.12+, the same requirements as Vite 7. These ranges ensure Node.js supports
require(esm) without a flag, allowing Vite to be distributed as ESM only.
Additional Features
Beyond the Rolldown integration, Vite 8 includes several notable features:
Integrated Devtools: Vite 8 ships
devtools option to enable Vite Devtools, a developer tooling for debugging and analysis. Vite Devtools provide deeper insights into your Vite-powered projects directly from the dev server.
Built-in tsconfig
paths support: Developers can enable TypeScript path alias resolution by setting
resolve.tsconfigPaths to
true. This has a small performance cost and is not enabled by default.
emitDecoratorMetadata support: Vite 8 now has built-in automatic support for TypeScript's
emitDecoratorMetadata option, removing the need for external plugins. See the Features page for details.
Wasm SSR support:
.wasm?init imports now work in SSR environments, expanding Vite's WebAssembly feature to server-side rendering.
Browser console forwarding: Vite 8 can forward browser console logs and errors to the dev server terminal. This is especially useful when working with coding agents, as runtime client errors become visible in the CLI output. Enable it with
server.forwardConsole, which activates automatically when a coding agent is detected.
@vitejs/plugin-react v6
Alongside Vite 8, we are releasing
@vitejs/plugin-react v6. The plugin uses Oxc for React Refresh transform. Babel is no longer a dependency and the installation size is smaller.
For projects that need the React Compiler, v6 provides a
reactCompilerPreset helper that works with
@rolldown/plugin-babel, giving you an explicit opt-in path without burdening the default setup.
See the Release Notes for more details.
Note that v5 still works with Vite 8, so you can upgrade the plugin after upgrading Vite.
Looking Ahead
The Rolldown integration opens the door to improvements and optimizations. Here is what we are working on next:
Full Bundle Mode (experimental): This mode bundles modules during development, similar to production builds. Preliminary results show 3x faster dev server startup, 40% faster full reloads, and 10x fewer network requests. This is especially impactful for large projects where the unbundled dev approach hits scaling limits.
Raw AST transfer: Allows JavaScript plugins to access the Rust-produced AST with minimal serialization overhead, bridging the performance gap between Rust internals and JS plugin code.
Native MagicString transforms: Enables custom transforms where the logic lives in JavaScript but the string manipulation computation runs in Rust.
Stabilizing the Environment API: We are working to make the Environment API stable. The ecosystem has started regular meetings to better collaborate together.
Install Size
We want to be transparent about changes to Vite's install size. Vite 8 is approximately 15 MB larger than Vite 7 on its own. This comes from two main sources:
~10 MB from lightningcss: Previously an optional peer dependency, lightningcss is now a normal dependency to provide better CSS minification out of the box.
~5 MB from Rolldown: The Rolldown binary is larger than esbuild + Rollup mainly due to performance optimizations that favor speed over binary size.
We will continue monitoring and working to reduce install size as Rolldown matures.
Migrating to Vite 8
For most projects, upgrading to Vite 8 should be a smooth process. We built a compatibility layer that auto-converts existing
esbuild and
rollupOptions configuration to their Rolldown and Oxc equivalents, so many projects will work without any config changes.
For larger or more complex projects, we recommend the gradual migration path: first switch from
vite to the
rolldown-vite package on Vite 7 to isolate any Rolldown-specific issues, then upgrade to Vite 8. This two-step approach makes it easy to identify whether any issues come from the bundler change or from other Vite 8 changes.
Please review the detailed Migration Guide before upgrading. The complete list of changes is in the Vite 8 Changelog.
Thank You, Rollup and esbuild
As Vite moves to Rolldown, we want to take a moment to express our deep gratitude to the two projects that made Vite possible.
Rollup has been Vite's production bundler since the very beginning. Its elegant plugin API design proved so well-conceived that Rolldown adopted it as its own, and Vite's entire plugin ecosystem exists because of the foundation Rollup laid. The quality and thoughtfulness of Rollup's architecture shaped how Vite thinks about extensibility. Thank you, Rich Harris for creating Rollup, and Lukas Taegert-Atkinson and the Rollup team for maintaining and evolving it into something that has had such a lasting impact on the web tooling ecosystem.
esbuild powered Vite's remarkably fast development experience from its early days: dependency pre-bundling, TypeScript and JSX transforms that completed in milliseconds rather than hundreds. esbuild proved that build tools could be orders of magnitude faster, and its speed set the bar that inspired an entire generation of Rust and Go-based tooling. Thank you, Evan Wallace, for showing all of us what was possible.
Without these two projects, Vite would not exist as it does today. Even as we move forward with Rolldown, the influence of Rollup and esbuild is deeply embedded in Vite's DNA, and we are grateful for everything they have given to the ecosystem. You can learn more about all the projects and people Vite depends on at our Acknowledgements page.
Acknowledgments
Vite 8 was led by sapphi-red and the Vite Team with the help of the wide community of contributors, downstream maintainers, and plugin authors. We want to thank the Rolldown team for their close collaboration in making the Rolldown-powered Vite 8 possible. We are also especially grateful to everyone who participated in the
rolldown-vite preview and the Vite 8 beta period. Your testing, bug reports, and feedback made the Rolldown migration possible and shaped this release into something we are proud of.
Vite is brought to you by VoidZero, in partnership with Bolt and NuxtLabs. We also want to thank our sponsors on Vite's GitHub Sponsors and Vite's Open Collective.
Cloudflare supports Vite's mission
June 4, 2026
Today marks the start of a new stage for Vite. VoidZero is joining Cloudflare. You can read the full story from Evan You in VoidZero's announcement. In Cloudflare's blog post, they explain why they are investing in the Vite stack, which has now become part of the web's foundational infrastructure. Vite's team governance, mission, and philosophy aren't changing:
Vite remains open source under the MIT license.
Vite remains vendor-agnostic, applications built with vite are meant to run anywhere.
Vite continues to be stewarded by the Vite team, which includes members employed by different organizations and independent members.
Vite's Open Collective funds are managed by the Vite team and are used to fund independent core team members, dependencies, and other key projects in the ecosystem.
The Vite team members employed by VoidZero are all joining Cloudflare and will continue to work on Vite.
As stated in the VoidZero and Cloudflare announcements, the same applies to Vitest, Rolldown, Oxc, and Vite+.
Cloudflare's Vite Ecosystem Open Source Fund
Cloudflare is committed to helping Vite remain neutral and has also announced a new $1M open source fund for the Vite ecosystem. Alongside Vite's Open Collective (which stays managed by the Vite team), these funds will allow us to further improve Vite and its ecosystem, including:
Fund more popular plugins and toolings in the ecosystem.
Adopt a core team member stipend to support independent team members.
Work closely with teams of the Vite stack, including Rolldown, Oxc, and Vite+.
Work closely with the ecosystem maintainers from frameworks, plugins, and deployment platforms.
Work with standard bodies and adopt new web platform features faster.
Audit and release security issues more quickly.
Many of which we had already started working on, which will help accelerate the process.
Thank You
We want to thank our current sponsors through GitHub Sponsors and Open Collective, which remain invaluable to us. We'd also like to thank the teams from projects, ecosystem frameworks, and plugins whose collaboration helped Vite reach where it is today. And also to the 1250+ contributors to the Vite repo and the users who keep providing valuable feedback to improve Vite.
We talked about what's next in Vite 8's announcement. We have made good progress towards Full Bundle Mode and the new Ecosystem Sync Calls, that gathers members of different frameworks, deploy platforms, and plugins, have become a great motor for new ideas to further expand Vite's capabilities. We think we're on a good trajectory to stabilize Vite's Environment API on Vite 9. As Vite's story continues to unfold, we look forward to the long path ahead to keep building the web together.