docs/blog/announcing-vite8-1.md
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:
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.
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:
:::
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.
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 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.
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:
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.
import.meta.globimport.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,
})
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.
<html-import src="./some/other/file.html"></html-import>
import { defineConfig } from 'vite'
export default defineConfig({
html: {
additionalAssetSources: {
'html-import': {
srcAttributes: 'src',
},
img: {
srcAttributes: ['data-src-dark', 'data-src-light'],
},
},
},
})
Check out the Changelog for other features and bug fixes.
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.