现代浏览器构建现在默认以 Safari 14 为目标，以实现更广泛的 ES2020 兼容性。这意味着现代构建现在可以使用 BigInt，并且不再转译空值合并运算符。如果需要支持旧的浏览器，可以像往常一样添加@vitejs/plugin-legacy。
大家好，我是 CUGGZ。
12 月 9 日，Vite 4.0 正式发布。下面就来看看 Vite 4.0 有哪些更新吧！
与 Vite 3 相比，这个主版本的的更新范围更小，主要目标是升级到 Rollup 3。Vite 团队与生态系统紧密合作，以确保这个新的主要版本顺利升级。
Rollup 3
Vite 4.0 使用 Rollup 3，这使我们能够简化 Vite 的内部资源处理并有许多改进。
Vite core monorepo 框架插件
@vitejs/plugin-vue和@vitejs/plugin-react从 Vite 的第一个版本开始就是 Vite core monorepo 的一部分。这有助于在进行更改时获得紧密的反馈循环，因为同时测试和发布了 Core 和插件。
借助vite-ecosystem-ci，可以通过在独立仓库上开发的这些插件获得此反馈，因此从 Vite 4 开始，它们已从 Vite core monorepo 中移出。
在开发过程中使用 SWC 的新 React 插件
SWC 现在是 Babel 的成熟替代品，尤其是在 React 项目中。SWC 的 React 快速重新刷新比 Babel 快很多，对于某些项目来说，SWC 现在是一个更好的选择。从 Vite 4 开始，有两个插件可用于不同的 React 项目。
（1）@vitejs/plugin-react
@vitejs/plugin-react是一个使用 esbuild 和 Babel 的插件，以较小的包占用空间和能够使用 babel transform pipeline 的灵活性实现快速 HMR。
（2）@vitejs/plugin-react-swc (新)
@vitejs/plugin-react-swc是一个新的插件，在构建过程中使用 esbuild，但在开发过程中将 Babel 替换为 SWC。对于不需要非标准 React 扩展的大型项目，冷启动和热更新 (HMR) 会加快。
兼容性
现代浏览器构建现在默认以 Safari 14 为目标，以实现更广泛的 ES2020 兼容性。这意味着现代构建现在可以使用 BigInt，并且不再转译空值合并运算符。如果需要支持旧的浏览器，可以像往常一样添加@vitejs/plugin-legacy。
将 CSS 作为字符串导入
在 Vite 3 中，.css文件的默认导出可能会引入 CSS 的双重加载。
import cssString from './global.css';
这种双重加载可能会发生，因为会发出.css文件，并且很可能 css 字符串也会被应用代码使用。从 Vite 4 开始，.css默认导出被弃用。在这种情况下，需要使用?inline查询后缀修饰符，因为它不会发出导入的.css样式。
import stuff from './global.css?inline'
其它功能
预打包依赖项时支持 patch-package；
更简洁的构建日志输出并切换到 kB 以与浏览器开发工具保持一致；
Vite 4.0 更新详情：https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md
©本文为清一色官方代发，观点仅代表作者本人，与清一色无关。清一色对文中陈述、观点判断保持中立，不对所包含内容的准确性、可靠性或完整性提供任何明示或暗示的保证。本文不作为投资理财建议，请读者仅作参考，并请自行承担全部责任。文中部分文字/图片/视频/音频等来源于网络，如侵犯到著作权人的权利，请与我们联系（微信/QQ:1074760229）。转载请注明出处：清一色财经
微信扫码打赏 
支付宝扫码打赏 
