Vite 4.0 正式发布!

简介: Vite 4.0 正式发布!

下面就来看看 Vite 4.0 有哪些更新吧! 1.webp.jpg

与 Vite 3 相比,这个主版本的的更新范围更小,主要目标是升级到 Rollup 3。Vite 团队与生态系统紧密合作,以确保这个新的主要版本顺利升级。

Rollup 3

Vite 现在正在使用 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 的双重加载。

css

复制代码

import cssString from './global.css';

这种双重加载可能会发生,因为会发出.css文件,并且很可能 css 字符串也会被应用代码使用。从 Vite 4 开始,.css默认导出被弃用。在这种情况下,需要使用 ?inline 查询后缀修饰符,因为它不会发出导入的.css样式。

css

复制代码

import stuff from './global.css?inline'

其它功能

  • 预打包依赖项时支持 patch-package;
  • 更简洁的构建日志输出并切换到 kB 以与浏览器开发工具保持一致;
  • 改进 SSR 期间的错误消息。

Vite 4.0 更新详情:github.com/vitejs/vite…

相关文章
|
开发工具 数据安全/隐私保护 git
Git切换本地用户名,IDEA集成Git如何切换本地用户名
Git切换本地用户名,IDEA集成Git如何切换本地用户名
598 3
|
6月前
|
人工智能 安全 BI
2026年企业级BI系统建设方案,从数据孤岛到智能决策的架构设计
2026年,数据已成为核心生产要素,但企业仍困于数据孤岛、口径不一、分析迟滞。本文聚焦企业级BI建设,提出“从孤岛到智能决策”路径,以瓴羊Quick BI为标杆,详解其全域治理、AI原生分析与安全服务三层架构,助力构建可落地、可演进、可智能的决策中枢。(239字)
|
机器学习/深度学习 人工智能 自然语言处理
生成式人工智能入门指南
生成式 AI 是人工智能的一个子领域,专注于通过学习现有数据的模式创建新内容或生成解决方案。它是一种鼓励 AI 系统利用对数据结构的理解自主生成新颖、类似于人类的输出的方法。这可以采用图像、文本、音乐或甚至是代码的形式呈现。
692 3
|
人工智能 前端开发 数据挖掘
真实场景|芯片研发平台如何真正实现一体化混合云调度?
AI芯片设计公司X面临多项目并行研发的高并发算力缺口,本地集群资源紧张。为解决混合调度和成本可控的难题,X公司引入MemVerge的EDA混合云研发平台。该平台统一调度本地与云端资源,无缝兼容现有工作流程,智能动态扩缩容,优化成本。例如,在前端回归验证中,3000个job通过优先使用本地2500核集群,剩余1000个job自动调度至云端运行,确保高效处理。对于新项目紧急任务,平台智能分配云上资源,并收集运行数据优化后续调度。
578 4
|
JavaScript 开发工具 git
工程化:Commitlint / 规范化Git提交消息格式
通过这些思维导图和分析说明表,您可以更加直观地理解Commitlint的安装、配置和使用方法,从而有效规范Git提交消息,提升团队协作效率和代码质量。
732 14
|
开发工具 git
git clone避坑的万能步骤
git clone避坑的万能步骤
3392 1
|
机器学习/深度学习 自然语言处理 算法
|
存储 数据库 索引
数据库索引的作用
【7月更文挑战第2天】数据库索引的作用
990 3