Mydoc

外观

Vite5 ​

更新主要内容 ​

  1. 集成Rollup 4：Vite 5现在由Rollup 4驱动，显著提高了构建性能。
  2. API清理：此次更新重点在于清理API，移除已弃用的特性，并对多个功能进行了优化。例如，define 特性现在使用真正的AST（抽象语法树）替换，而不是正则表达式。
  3. Node.js支持：Vite 5要求使用Node.js 18或更高版本，不再支持Node.js 14、16、17和19版本。
  4. 性能提升：引入了一个新特性 server.warmup，用于提升启动时间，通过在服务器启动时预转换模块列表。此外，还提供了一个新指南，帮助识别和修复常见的性能问题。
  5. 主要变更：其他重要变更包括重构define和import.meta.env.*的替换策略，统一开发和预览HTML的服务行为，将清单文件默认生成在.vite目录中，更新了TypeScript的experimentalDecorators和useDefineForClassFields行为，移除了--https标志和https: true选项。
  6. 弃用和移除：弃用了CJS Node API，并移除了一些先前已弃用的API

Rollup 4 ​

  1. 原生代码集成: Rollup现在包含了原生代码，这些代码会作为可选的npm依赖项自动安装（并在不需要时移除），如果你的平台和架构得到支持的话。Rollup有一个optionalDependencies列表，其中每个依赖项只会在特定的操作系统和CPU上安装。 如果你的系统不受支持，Rollup启动时会显示错误消息，告诉你你的平台和架构，并提供一个受支持的列表。在这种情况下，你可以使用@rollup/wasm-node作为平台独立的替代品
  2. 改进的哈希算法：Rollup现在在文件名中使用url安全的base64哈希而不是旧的base16哈希。这提供了更高的哈希安全性，但也意味着出于技术原因，哈希长度现在最多限制为22个字符
  3. CLI应用打包改进：当打包CLI应用时，Rollup现在会自动保留入口文件中的shebang注释，如果输出格式是es或cjs。以前，你需要通过插件添加这种注释

API清理 ​

define ​

define特性现在使用真正的AST（抽象语法树）替换，而不是正则表达式。这意味着它现在可以正确地处理更多的代码，例如，它不再会将字符串中的import语句视为导入

  • 更精确的代码处理：AST是一种表示源代码结构的模型，能够更精确地理解和处理代码。与正则表达式相比，它能更准确地理解代码的语义和结构。
  • 减少错误和不精确匹配：使用正则表达式可能会导致错误的或不精确的匹配，因为正则表达式通常只是基于文本模式匹配，而不理解代码的实际语义。AST避免了这种情况。
  • 提高性能：虽然AST的处理可能在某些情况下比正则表达式更复杂，但它可以提供更高效和精确的代码转换，从而提高整体性能。

抽象语法树（Abstract Syntax Tree，简称AST） ​

这是一种用来表示源代码结构的树状数据结构。在编程语言的编译过程中，抽象语法树是一个非常重要的概念。以下是其主要特点和用途：

特点 ​
  • 结构表示：AST 将源代码的语法结构表示为树形结构，每个节点代表源代码中的一个构造，如语句、表达式
  • 抽象层次：它抽象出了源代码的语法细节，只关注语法元素之间的关系。
  • 不同于解析树：解析树（Parse Tree）通常包含更多的细节，而AST省略了一些语法上不太重要的部分（如括号）。
用途 ​
  • 代码转换：AST 可以用来进行代码转换，例如代码压缩、代码格式化、代码语法检查等。
  • 代码生成：AST 也可以用来生成代码，例如编译器将源代码转换为目标代码时，就会先将源代码转换为 AST，然后再将 AST 转换为目标代码。
  • 代码重构和格式化：通过操作AST，可以实现代码的重构和格式化。

import.meta.env ​

import.meta.env.*变量现在使用真正的AST替换，而不是正则表达式。这意味着它现在可以正确地处理更多的代码，例如，它不再会将字符串中的import语句视为导入

Node.js支持 ​

  1. Node.js 18：Vite 5要求使用Node.js 18或更高版本，不再支持Node.js 14、16、17和19版本
  2. Node.js 18 ESM：Vite 5现在使用Node.js 18的ESM模块，而不是CommonJS模块。这意味着你可以在你的项目中使用import语句，而不是require()调用。如果你的项目使用了CommonJS模块，你可以使用@rollup/plugin-commonjs插件将它们转换为ESM模块

性能提升 ​

模块预转换 ​

server.warmup的核心思想是在服务器启动时就预先转换一系列指定的模块。这一步骤的目的是加速这些模块的可用性，减少它们被请求时的服务时间。

应对Vite的按需性质 ​

传统上，Vite作为一个按需文件服务器运行，按需转换和服务文件。这种方法确保只做必要的工作，但在开发周期开始和首次访问文件时可能会导致延迟。server.warmup旨在通过预先转换已知的关键文件来减轻这些延迟，使它们准备好并缓存，以便在请求时立即提供。

高效处理深层模块图 ​

在具有深层模块图的复杂项目中（一个文件导入另一个文件等），一个文件的转换可能依赖于另一个文件的完成。这种依赖链可能会创建瀑布效应，减慢过程。通过预热这些图中的关键文件，server.warmup确保这些文件被预处理和缓存，随时可用，从而减少这种内部瀑布的影响。

通过clientFiles和ssrFiles选项进行定制 ​

该功能提供了如clientFiles和ssrFiles等选项，用于指定哪些文件将为客户端和服务器转换预热。这些选项接受直接文件名或glob模式，提供灵活性，以定义预热过程的范围。

自动预热入口点 ​

在Vite中使用--open或server.open选项时，server.warmup功能将自动预热应用程序的入口点或提供的URL。这种自动过程进一步增强了启动体验，确保应用程序的初始加载尽可能快。

未预热URL的日志 ​

如果某些URL未被预热并在页面加载后被访问，它们将出现在日志中。这种反馈允许开发人员调整他们的server.warmup配置，通过在未来的优化中将这些URL添加到clientFiles选项中。