⚡ Vite 6 来了,4 周年爆肝升级第 6 个主版本!!!

7,235 阅读4分钟

00-vite6.png

作者:Vite 团队

译者:林语冰

资源:Vite 官方博客[1]

免责声明:活人翻译,略有删改,仅供粉丝参考!

00. 前言

Vite 团队官宣 Vite 6 正式发布,这是 Vite 诞生 4 周年的第 6 个主版本升级!👍

👇 Vite 5 升级到 Vite 6 的重要更新如下:

  • 新增实验性 Environment API
  • resolve.conditions 的默认值
  • json.stringify 的新默认值
  • 支持更多 HTML 元素的资源引用
  • postcss-load-config 更新
  • Sass 现在默认使用现代 API
  • library 模式自定义 CSS 输出文件名

此外,还有只会影响少数用户的一些破坏性更新。对于大多数项目而言,升级到 Vite 6 相对丝滑,推荐阅读 升级指南[2]。

Vite 官网还新增了一个 破坏性更新 页面,列出了 Vite 中所有计划中和过去的更改。

01. 加速 Vite 生态

去年 Vite 5 发布以来,Vite 的采用率与日俱增,npm 周下载量从 750 万次爆涨到 1700 万次。

01-trend.png

新生代框架也加入了 Vite 生态,包括 TanStack Start、Ember 等,可以参考 Astro、Nuxt、React Router 等所做的改进。

Vite 还被 OpenAI、谷歌、苹果、微软、NASA(美国航空航天局)等大厂广泛采用。

上个月,Vite 社区齐聚一堂,参加由 StackBlitz 主办的第三届 ViteConf 大会。

“Vite 之父”尤雨溪官宣创立 VoidZero —— 这是一家致力于为 JS 生态构建开源、高性能和统一开发工具链的公司。VoidZero 是 Rolldown 和 Oxc 的幕后推手,为被 Vite 采用做好准备。

02-conf.png

Nate Weiner 宣布推出 One,这是一个由 Vite 支持的用于 Web 和原生开发的 React 新框架。Storybook 则展示了他们最新的 Vitest 支持的测试功能。

Vite 还获得了一个新版登录页面,现在 Vite 官网的 URL 指向 vite.dev 新域名。

Vite 新官网的设计和实现由 VoidZero 完成,他们还制作了 VoidZero 的官网。

02. Vite 6,启动

Vite 6 是 Vite 2 以来最重要的主版本升级。

你可以使用 pnpm create vite 和喜欢的框架快速搭建 Vite 应用,或者使用 vite.new[3] 在线试玩 Vite 6。

你还可以运行 pnpm create vite-extra 访问来自 Solid 等其他框架和 Deno 等运行时的模板。当你在 Others 选项下运行 create vite 时,create vite-extra 的模板也适用。

Vite 入门模板旨在成为不同框架测试 Vite 的试验场,在构建新项目时,你应该采用每个框架推荐的启动器(starter)。

create vite 还提供了一个快捷方式,可以通过一些框架设置合适的启动器,比如 create-vueNuxt 3RemixAngular 等。

03. Node 的支持

类似于 Vite 5,Vite 6 支持 Node 18、20 和 22+,且 不再支持 Node 21。

Vite 放弃支持 EOL(end of life,生命周期结束)之后的旧版 Node。Node 18 EOL 将于明年 4 月底结束,之后 Vite 可能会升级到 Vite 7 主版本,来支持要求的 Node 版本。

04. 实验性 Environment API

Vite 新增 实验性 的 Environment API(环境 API),允许框架作者提供更接近生产的开发体验。

如果你正在构建 SPA(单页应用),即当在单个客户端环境时,一如既往地使用即可,Vite 6 没有太大的变化。对于自定义 SSR(服务端渲染)应用,Vite 6 也向后兼容。

Vite 6 的 Environment API 主要目标受众是 框架作者。如果你是框架作者或 Vite 插件维护者,推荐阅读 Environment API[4] 的指南。

特别鸣谢参与定义和实现新 API 的所有人。AntFu 和 Pooya Parsa 制作了 vite-node,优化了 Nuxt 与 Vite 的 Dev SSR,支持 Vitest。

去年年初,Vladimir 开始推行 vite-node 到 Vite Core,一年后 Vite 5.1 将其作为 Runtime API 发布。特别鸣谢 Cloudflare 团队等合作伙伴的反馈促使我们重新对 Vite 的 Environment 更激进地设计。

05. 鸣谢

Vite 由 VoidZero、Nuxt Labs 和 Astro 等联合推出,在此向 GitHub 赞助商和开源集体脱帽致敬。

特别鸣谢 Vite Core 的 1000+ 贡献者,以及辅助打造 Vite 6 插件、集成、工具和翻译的维护者。

最后,诚邀你踊跃参与 Vite 社区,帮助我们优化 Vite。

粉丝互动 😍

👉 本期的话题是:你正在用 Vite 还是 Webpack 等其他构建工具,为什么

欢迎你在本文下方留言互动,或者友情转发。👻

我是大家的林语冰 👨‍💻,欢迎持续关注我,随时了解前端社区的最新资讯。

谢谢大家的点赞和转发,我们下期再见,掰掰~ 👍

参考文献

[1] Vite 官方博客: vite.dev/blog/announ…

[2] 升级指南: vite.dev/guide/migra…

[3] vite.new: vite.new

[4] Environment API: main.vite.dev/guide/api-e…