20241206-vite6.0发布，对日常使用有影响吗？Rolldown上了吗？

vite6.0版本最大的更新其实可以说是环境 API，下面更新内容都取自官网

环境 API

作为新的实验性 环境 API 的一部分，我们进行了大规模的内部重构。Vite 6 努力避免引入破坏性的变更，以确保大多数项目能够快速升级到新的主要版本。我们会等待大部分的生态系统迁移并稳定后，再开始推荐使用新的 API。可能会有一些边缘情况，但这些应该只会影响到框架和工具的底层使用。我们已经与生态系统中的维护者合作，在发布前减轻了这些差异。如果你发现了回退性问题，请 新建 issue。

由于 Vite 的实现发生了改变，一些内部的 API 已经被移除了。如果你依赖于其中的某一个，那么请创建一个 feature request。

Vite Runtime API

实验性的 Vite Runtime API 已经演变为模块运行器 API（Module Runner API），这是作为新的实验性 环境 API 的一部分，在 Vite 6 中发布。鉴于这个功能是实验性的，所以在 Vite 5.1 中引入的先前 API 的移除并不是一个破坏性的更改，但是用户在迁移到 Vite 6 的过程中，需要将他们的使用方式更新为与模块运行器相等的方式。

总体变化

resolve.conditions 的默认值

此更改不会影响未配置 resolve.conditions / ssr.resolve.conditions / ssr.resolve.externalConditions 的用户。

在 Vite 5 中，resolve.conditions 的默认值是 []，某些条件是内部添加的。ssr.resolve.conditions 的默认值是 resolve.conditions 的值。

从 Vite 6 开始，部分条件不再在内部添加，需要包含在配置值中。 不再在内部添加的条件为

  • resolve.conditions 是 ['module', 'browser', 'development|production']
  • ssr.resolve.conditions 是 ['module', 'node', 'development|production']

这些选项的默认值会更新为相应的值，ssr.resolve.conditions 不再使用 resolve.conditions 作为默认值。请注意，development|production是一个特殊变量，会根据 process.env.NODE_ENV 的值被替换为 production 或 development。这些默认值从 vite 导出为 defaultClientConditions 和 defaultServerConditions。

如果为 resolve.conditions 或 ssr.resolve.conditions 指定了自定义值，则需要更新该值以包含新条件。 例如，如果先前为 resolve.conditions 指定了 ['custom']，那么现在就需要指定 ['custom', ...defaultClientConditions]。

JSON stringify

在 Vite 5 中，当设置 json.stringify: true 时，json.namedExports 会被禁用。

从 Vite 6 开始，即使设置了 json.stringify: true，json.namedExports 也不会被禁用。如果希望实现以前的行为，可以设置 json.namedExports: false。

Vite 6 还为 json.stringify 引入了一个新的默认值，即 'auto'，它只会对大型 JSON 文件进行字符串化处理。要禁用此行为，请设置 json.stringify: false。

在 HTML 元素中扩展对资源引用的支持

在 Vite 5 中，只有少数支持的 HTML 元素能够引用由 Vite 处理和打包的资源，如<link href>、<img src> 等。

Vite 6 扩展了对更多 HTML 元素的支持。完整列表请参见 HTML 功能介绍 文档。

要在某些元素上选择不进行 HTML 处理，可以在元素上添加 vite-ignore 属性。

postcss-load-config

postcss-load-config 已从 v4 更新至 v6。现在需要 tsx 或 jiti 来加载 TypeScript postcss 配置文件，而非 ts-node。此外，现在需要 yaml 来加载 YAML postcss 配置文件。

Sass 现在默认使用现代 API

在 Vite 5 中，Sass 默认使用传统 API。Vite 5.4 增加了对现代 API 的支持。

从 Vite 6 开始，Sass 默认使用现代 API。如果想继续使用传统 API，可以设置 css.preprocessorOptions.sass.api: 'legacy' / css.preprocessorOptions.scss.api: 'legacy'。但请注意，传统 API 支持将在 Vite 7 中移除。

要迁移到现代 API，请参阅 Sass 文档。

在 library 模式下自定义 CSS 输出文件名

在 Vite 5 中，library 模式下的 CSS 输出文件名始终是 style.css，无法通过 Vite 配置轻松更改。

从 Vite 6 开始，默认文件名将使用 package.json 中的 "name"，与 JS 输出文件类似。如果 build.lib.fileName 设置为字符串，该值也将用于 CSS 输出文件名。要明确设置不同的 CSS 文件名，可以使用新的 build.lib.cssFileName 进行配置。

迁移时，如果您依赖于 style.css 文件名，则应根据软件包名称将对该文件的引用更新为新名称。例如:

package.json

json

1
2
3
4
5
6
7
{
  "name": "my-lib",
  "exports": {
    "./style.css": "./dist/style.css"
    "./style.css": "./dist/my-lib.css"
  }
}

如果你更喜欢像在 Vite 5 中那样使用 style.css，可以设置 build.lib.cssFileName: 'style'。

进阶

还有其他一些只影响少数用户的破坏性更改。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
import type { Plugin, EnvironmentModuleNode } from 'vite'

function hmrReload(): Plugin {
  return {
    name: 'hmr-reload',
    enforce: 'post',
    hotUpdate: {
      order: 'post',
      handler({ modules, server, timestamp }) {
        if (this.environment.name !== 'ssr') return

        let hasSsrOnlyModules = false

        const invalidatedModules = new Set<EnvironmentModuleNode>()
        for (const mod of modules) {
          if (mod.id == null) continue
          const clientModule =
            server.environments.client.moduleGraph.getModuleById(mod.id)
          if (clientModule != null) continue

          this.environment.moduleGraph.invalidateModule(
            mod,
            invalidatedModules,
            timestamp,
            true,
          )
          hasSsrOnlyModules = true
        }

        if (hasSsrOnlyModules) {
          server.ws.send({ type: 'full-reload' })
          return []
        }
      },
    },
  }
}

总结

对日常开发影响

对日常开发影响不大，这次更新其实更像一个过渡版本，大多数项目可以轻松迁移到 Vite 6，注意是否涉及到上面部分修改即可

Rolldown上了吗

此次更新并未提及，但在最新v6文档中已经提到

Rollup 已经开始着手改进性能，在 v4 中将其解析器切换到 SWC。同时还有一个正在进行中的工作，即构建一个名为 Rolldown 的 Rust 版本的 Rollup。一旦 Rolldown 准备就绪，它就可以在 Vite 中取代 Rollup 和 esbuild，显著提高构建性能，并消除开发和构建之间的不一致性。你可以观看 Evan You 在 ViteConf 2023 的主题演讲 了解更多细节。

估计不会等太久！Rolldown官网介绍

https://tian-1-2.github.io/typblog/2024/12/06/vite6.0发布，对日常使用有影响吗？RoullDown上了吗？/
作者
田云鹏
发布于
2024年12月6日
许可协议