Vite 6.0 发布啦！[1]
2024年11月26日
今天，我们在Vite的发展历程中又迈出了一大步。Vite的团队[2]、贡献者[3]以及生态系统合作伙伴都很高兴地宣布Vite 6版本发布了。
这是成果丰硕的一年。Vite的采用率持续增长，自一年前Vite 5发布以来，每周的npm下载量从750万次跃升至1700万次。Vitest[4]不仅越来越受用户青睐，而且还开始形成自己的生态系统。例如，Storybook[5]拥有了由Vitest提供支持的新测试功能。
新的框架也加入了Vite生态系统，包括TanStack Start[6]、One[7]、Ember[8]等等。Web框架的创新步伐日益加快。你可以查看一下Astro[9]、Nuxt[10]、SvelteKit[11]、Solid Start[12]、Qwik City[13]、RedwoodJS[14]、React Router[15]等项目所做的改进，类似的项目还有很多。
OpenAI、谷歌、苹果、微软、美国国家航空航天局（NASA）、Shopify、Cloudflare、GitLab、Reddit、Linear等众多公司都在使用Vite。两个月前，我们开始整理一份使用Vite的公司列表[16]。我们很高兴看到许多开发者向我们发送拉取请求（PR），将他们所在的公司添加到这个列表中。很难想象，自Vite迈出第一步以来，我们共同打造的这个生态系统已经发展得如此壮大。
加速Vite生态系统发展[17]
上个月，社区齐聚一堂，参加了由StackBlitz[18]再次主办的第三届ViteConf[19]。这是规模最大的Vite会议，生态系统中的众多构建者都参与其中。在众多发布消息中，尤雨溪（Evan You）宣布了VoidZero[20]，这是一家致力于为JavaScript生态系统打造开源、高性能且统一的开发工具链的公司。VoidZero是Rolldown[21]和Oxc[22]背后的团队，他们取得了重大进展，使其能迅速准备好被Vite采用。观看尤雨溪的主题演讲，可进一步了解Vite基于Rust的未来发展方向。
StackBlitz[23]推出了bolt.new[24]，这是一个结合了Claude和WebContainers的Remix应用，能让你提示、编辑、运行和部署全栈应用。内特·韦纳（Nate Weiner）宣布了One[25]，这是一个由Vite支持的用于Web和原生应用的新React框架。Storybook展示了他们最新的由Vitest提供支持的测试功能[26]。还有很多其他内容。我们鼓励你观看全部43场演讲[27]。演讲者们付出了巨大努力，与我们分享了各个项目的进展情况。
Vite还更新了首页，并且有了一个简洁的域名。今后你应该将网址更新为指向新的https://vite.dev/[28]域名。新的设计和实现是由VoidZero完成的，就是打造他们自己网站的那帮人哦。要特别感谢维森特·罗德里格斯（Vicente Rodriguez）[29]和西蒙·勒·马钱特（Simon Le Marchant）[30]。
Vite的下一个重大版本来了[31]
Vite 6是自Vite 2以来最重要的重大版本发布。我们渴望与生态系统合作，通过新的应用程序编程接口（API）继续拓展我们的共享资源，并且像往常一样，打造一个更精良的基础以供构建应用。
快速链接：
文档[32] 翻译版本：简体中文[33]、日语[34]、西班牙语[35]、葡萄牙语[36]、韩语[37]、德语[38] 迁移指南[39] GitHub更新日志[40]
如果你刚开始接触Vite，我们建议你先阅读入门指南[41]和功能介绍[42]。
我们要感谢1000多名Vite核心贡献者以及Vite插件、集成、工具和翻译的维护者与贡献者，他们帮助我们打造了这个新的重大版本。我们邀请你参与进来，帮助我们为整个生态系统改进Vite。欲了解更多信息，请查看我们的贡献指南[43]。
首先，我们建议帮忙梳理问题[44]、审查拉取请求（PR）[45]，根据公开问题发送失败测试的PR，并在讨论区[46]以及Vite Land的帮助论坛[47]中为其他人提供支持。如果你想和我们交流，可以加入我们的Discord社区[48]，并在#贡献频道[49]打个招呼。
要获取有关Vite生态系统和Vite核心的最新消息，请在Bluesky[50]、X（原推特）[51]或者Mastodon[52]上关注我们。
开始使用Vite 6[53]
你可以使用pnpm create vite命令，根据自己偏好的框架快速搭建一个Vite应用，或者使用https://vite.new/[54]在线试用Vite 6。你也可以运行pnpm create vite-extra命令，以获取其他框架和运行时（如Solid、Deno、服务端渲染（SSR）以及库启动模板）的模板。当你在Others（其他）选项下运行create vite时，也可以使用create vite-extra模板。
Vite的启动模板旨在作为一个测试不同框架与Vite结合使用的“试验场”。在构建下一个项目时，你应该使用各框架推荐的启动模板。create vite命令还为一些框架（如create-vue、Nuxt 3、SvelteKit、Remix、Analog、Angular）提供了设置合适启动模板的快捷方式。
Node.js支持情况[55]
与Vite 5类似，Vite 6支持Node.js 18、20以及22及以上版本。Node.js 21版本的支持已被移除。在Node.js版本达到生命周期结束（EOL）[56]后，Vite会停止对旧版本的支持。Node.js 18的生命周期结束时间是2025年4月底，在此之后，我们可能会发布一个新的重大版本，提高所需的Node.js版本要求。
实验性环境应用程序编程接口（API）[57]
借助新的环境API，Vite变得更加灵活了。这些新的API将允许框架作者提供更贴近生产环境的开发体验，也便于生态系统共享新的构建模块。如果你正在构建单页面应用（SPA），那没有什么变化，当你在单一客户端环境中使用Vite时，一切都会像以前一样正常工作。而且即使对于自定义的服务端渲染（SSR）应用，Vite 6也是向后兼容的。环境API的主要目标受众是框架作者。
对于好奇的终端用户，萨菲（Sapphi）写了一篇很棒的环境API介绍[58]指南。这是一个很好的入手点，可以帮助你理解我们为什么要让Vite变得更加灵活。
如果你是框架作者或者Vite插件维护者，并且想要利用这些新的API，可以在环境API指南[59]中了解更多信息。
我们要感谢所有参与定义和实现这些新API的人员。Anthony Fu 和 Pooya Parsa 创建了vite-node，用于通过Vite改进Nuxt的开发服务端渲染（Dev SSR）情况[60]。随后安东尼使用vite-node为Vitest提供支持，Vladimir Sheremet 则不断对其进行改进。2023年初，Vladimir 开始着手将vite-node向上游合并到Vite核心中，一年后我们在Vite 5.1版本中将其作为运行时API发布了。来自生态系统合作伙伴（特别要感谢Cloudflare团队）的反馈促使我们对Vite的环境进行了一次更具雄心的重新设计。你可以在帕塔克（Patak）在ViteConf 24上的演讲[61]中了解更多相关故事。
Vite团队的每个人都参与了新API的定义工作，该API是结合生态系统中众多项目的反馈共同设计的。感谢每一位参与者！如果你正在基于Vite构建框架、插件或者工具，我们鼓励你参与进来。这些新的API是实验性的。我们将与生态系统合作，审视这些新API的使用情况，并在下一个重大版本中将它们稳定下来。如果你想问问题或者提供反馈，在这里[62]有一个开放的GitHub讨论话题。
主要变更[63]
`resolve.conditions`的默认值[64] JSON字符串化[65] 在HTML元素中对资源引用的扩展支持[66] postcss-load-config[67] Sass现在默认使用现代API[68] 在库模式下自定义CSS输出文件名[69] 以及其他仅会影响少数用户的变更[70]
还有一个新的重大变更[71]页面，上面列出了Vite中所有计划内、正在考虑以及过去已经发生的变更。
迁移到Vite 6[72]
对于大多数项目来说，更新到Vite 6应该是比较简单直接的，但我们建议在升级之前查看一下详细的迁移指南[73]。
完整的变更列表可在Vite 6更新日志[74]中查看。
鸣谢[75]
Vite 6是我们的贡献者社区、下游维护者、插件作者以及Vite团队[76]长时间努力工作的成果。我们感谢赞助Vite开发的个人和公司。Vite是由VoidZero[77]推出的，并与StackBlitz[78]、Nuxt Labs[79]以及Astro[80]进行合作。还要向Vite的GitHub赞助商[81]以及Vite的Open Collective[82]上的赞助商们表示感谢。
我是 ssh，工作 6 年+，阿里云、字节跳动 Web infra 一线拼杀出来的资深前端工程师 + 面试官，非常熟悉大厂的面试套路，Vue、React 以及前端工程化领域深入浅出的文章帮助无数人进入了大厂。 欢迎 长按图片加 ssh 为好友，我会第一时间和你分享前端行业趋势，学习途径等等。2024 陪你一起度过！
: #vite-6-0-is-out
[2]团队: https://vite.dev/team
[3]贡献者: https://github.com/vitejs/vite/graphs/contributors
[4]Vitest: https://vitest.dev/
[5]Storybook: https://storybook.js.org/
[6]TanStack Start: https://tanstack.com/start
[7]One: https://onestack.dev/
[8]Ember: https://emberjs.com/
[9]Astro: https://astro.build/
[10]Nuxt: https://nuxt.com/
[11]SvelteKit: https://kit.svelte.dev/
[12]Solid Start: https://www.solidjs.com/blog/introducing-solidstart
[13]Qwik City: https://qwik.builder.io/qwikcity/overview/
[14]RedwoodJS: https://redwoodjs.com/
[15]React Router: https://reactrouter.com/
[16]使用Vite的公司列表: https://github.com/vitejs/companies-using-vite
[17]: #speeding-up-the-vite-ecosystem
[18]StackBlitz: https://stackblitz.com/
[19]ViteConf: https://viteconf.org/24/replay
[20]VoidZero: https://staging.voidzero.dev/posts/announcing-voidzero-inc
[21]Rolldown: https://rolldown.rs/
[22]Oxc: https://oxc.rs/
[23]StackBlitz: https://stackblitz.com/
[24]bolt.new: https://bolt.new/
[25]One: https://onestack.dev/
[26]测试功能: https://youtu.be/8t5wxrFpCQY?si=PYZoWKf-45goQYDt
[27]全部43场演讲: https://www.youtube.com/playlist=PLqGQbXn_GDmnObDzgjUF4Krsfl6OUKxtp
[28]https://vite.dev/: https://vite.dev/
[29]维森特·罗德里格斯（Vicente Rodriguez）: https://bento.me/rmoon
[30]西蒙·勒·马钱特（Simon Le Marchant）: https://marchantweb.com/
[31]: #the-next-vite-major-is-here
[32]文档: https://vite.dev/
[33]简体中文: https://cn.vite.dev/
[34]日语: https://ja.vite.dev/
[35]西班牙语: https://es.vite.dev/
[36]葡萄牙语: https://pt.vite.dev/
[37]韩语: https://ko.vite.dev/
[38]德语: https://de.vite.dev/
[39]迁移指南: https://vite.dev/guide/migration
[40]GitHub更新日志: https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#600-2024-11-26
[41]入门指南: https://vite.dev/guide/
[42]功能介绍: https://vite.dev/guide/features
[43]贡献指南: https://github.com/vitejs/vite/blob/main/CONTRIBUTING.md
[44]梳理问题: https://github.com/vitejs/vite/issues
[45]审查拉取请求（PR）: https://github.com/vitejs/vite/pulls
[46]讨论区: https://github.com/vitejs/vite/discussions
[47]帮助论坛: https://discord.com/channels/804011606160703521/1019670660856942652
[48]Discord社区: http://chat.vite.dev/
[49]#贡献频道: https://discord.com/channels/804011606160703521/804439875226173480
[50]Bluesky: https://bsky.app/profile/vite.dev
[51]X（原推特）: https://twitter.com/vite_js
[52]Mastodon: https://webtoo.ls/@vite
[53]: #getting-started-with-vite-6
[54]https://vite.new/: https://vite.new/
[55]: #node-js-support
[56]生命周期结束（EOL）: https://endoflife.date/nodejs
[57]: #experimental-environment-api
[58]环境API介绍: https://green.sapphi.red/blog/increasing-vites-potential-with-the-environment-api
[59]环境API指南: https://main.vite.dev/guide/api-environment
[60]Nuxt的开发服务端渲染（Dev SSR）情况: https://antfu.me/posts/dev-ssr-on-nuxt
[61]帕塔克（Patak）在ViteConf 24上的演讲: https://www.youtube.com/watch?v=WImor3HDyqU?si=EZ-rFJn4pDW3tUvp
[62]这里: https://github.com/vitejs/vite/discussions/16358
[63]: #main-changes
[64]resolve.conditions的默认值: https://vite.dev/guide/migration#default-value-for-resolve-conditions
JSON字符串化: https://vite.dev/guide/migration#json-stringify
[66]在HTML元素中对资源引用的扩展支持: https://vite.dev/guide/migration#extended-support-of-asset-references-in-html-elements
[67]postcss-load-config: https://vite.dev/guide/migration#postcss-load-config
[68]Sass现在默认使用现代API: https://vite.dev/guide/migration#sass-now-uses-modern-api-by-default
[69]在库模式下自定义CSS输出文件名: https://vite.dev/guide/migration#customize-css-output-file-name-in-library-mode
[70]以及其他仅会影响少数用户的变更: https://vite.dev/guide/migration#advanced
[71]重大变更: https://vite.dev/changes/
[72]: #migrating-to-vite-6
[73]详细的迁移指南: https://vite.dev/guide/migration
[74]Vite 6更新日志: https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#500-2024-11-26
[75]: #acknowledgments
[76]Vite团队: https://vite.dev/team
[77]VoidZero: https://voidzero.dev/
[78]StackBlitz: https://stackblitz.com/
[79]Nuxt Labs: https://nuxtlabs.com/
[80]Astro: https://astro.build/
[81]Vite的GitHub赞助商: https://github.com/sponsors/vitejs
[82]Vite的Open Collective: https://opencollective.com/vite
