vite6更新了哪些内容

Vite 6 的主要更新内容（Vite 6 相对于 Vite 5）

根据 Vite 官方发布和迁移指南，这里是更加“细致”的 Vite 6 变化：

1. Node.js 支持

   • Vite 6 支持 Node.js 18、20、22+ 。(vitejs)
   • 不再支持 Node.js 21。 (vitejs)

2. 实验性环境 API（Environment API）

   • 引入了新的 Environment API，用于更灵活地处理不同运行时环境（如浏览器、服务端 / SSR、边缘环境等）。(vitejs)
   • 对框架作者和插件维护者非常有用；对于普通单页面应用（SPA）开发者，日常使用体验可以保持不变。(vitejs)
   • 旧版的 “Vite Runtime API”（Vite 5.1 的实验 API）演化成了 “Module Runner API”。(vitejs)

3. resolve.conditions 默认值变更

   • Vite 5 时，resolve.conditions 默认是空数组 []，然后 Vite 内部自动加了一些条件。(vitejs)
   • 在 Vite 6 中，默认值变更为 ['module', 'browser', 'development|production']（客户端） 和 ['module', 'node', 'development|production']（SSR）。(vitejs)
   • 如果你之前在配置里写了自定义 resolve.conditions，升级后需要把默认这些条件也加上。(vitejs)

4. JSON 处理能力增强

   • json.stringify 的默认值变成了 'auto'：只有较大的 JSON 文件才会被 stringify。(vitejs)
   • 即使你将 json.stringify: true，json.namedExports 也不会被禁用（在 Vite 5 中设置 stringify=true 会禁用 namedExports）。(vitejs)
   • 如果你想恢复旧行为（禁用 namedExports），可以手动设置 json.namedExports: false。(Medium)

5. HTML 里对资源引用（asset references）的支持扩展

   • Vite 6 对更多 HTML 元素中的资源引用（例如 <img>, <video> 等）进行了扩展处理，可以更灵活地打包 /处理这些资源。(vitejs)
   • 如果某些元素你不希望 Vite 去处理（做资源打包），可以给它加 vite-ignore 属性。(vitejs)

6. postcss-load-config 升级

   • postcss-load-config 从 v4 升级到 v6。(Medium)
   • 现在如果你用 TypeScript 写 PostCSS 配置（如 postcss.config.ts），需要使用 tsx 或 jiti，不再是 ts-node。(vitejs)
   • 如果你的 PostCSS 配置是 YAML 文件，现在必须引入 yaml 支持（因为 v6 版本要求）。(vitejs)

7. Sass 默认使用 “现代 API”

   • 在 Vite 5 中，默认是 Legacy API（旧 API）。Vite 6 改成默认使用 Modern API（较新的 Sass JS API）。(Medium)
   • 如果你还想使用 legacy API，可以通过配置 css.preprocessorOptions.sass.api: 'legacy' 或 css.preprocessorOptions.scss.api: 'legacy'。(vitejs)
   • 注意：legacy API 支持预计会在 Vite 7 中移除。(vitejs)
   • 有部分用户／库在用现代 API 时遇到兼容性问题（例如有 GitHub issue 报导 Sass-JSON 导入器的问题）(GitHub)

8. 库（library）模式下 CSS 输出文件名可自定义

   • 在 Vite 5 里，library 模式下打包出的 CSS 始终叫 style.css。(Medium)
   • Vite 6 新增 build.lib.cssFileName，你可以指定 CSS 输出文件名。(vitejs)
   • 默认文件名将根据 package.json 的 "name" 字段来命名（例如你的包名是 my-lib，生成的 CSS 就可能是 my-lib.css）。(Medium)
   • 如果你仍想使用旧 style.css 名称，可以设置 build.lib.cssFileName: 'style'。(vitejs)

9. 其他高级 /破坏性（breaking）改动（影响较少用户）

   • 在 SSR-dev 模式中，默认导入 CSS（import 'foo.css'） 支持被移除。(vitejs)
   • build.cssMinify 的默认值在 SSR 模式下也变更（改为 esbuild）。(vitejs)
   • server.proxy[path].bypass 现在也支持 WebSocket 升级（bypass 方法在 websocket 请求时也可能被调用，res 参数可能为 undefined）。(vitejs)
   • Terser 依赖升级：最小支持版本变为 5.16.0。(vitejs)
   • @rollup/plugin-commonjs 升级到 v28，commonjsOptions.strictRequires 的默认值改了（以前是 'auto'，现在默认是 true）。(vitejs)
   • 删除了一些已弃用 / 无用的配置项和 API，比如 fs.cachedChecks、某些旧环境 API 类型、Hot Broadcaster 相关类型等。(vitejs)
   • optimizeDeps.entries 现在始终视为 glob 模式（不再接受文字路径），意味着你在配置这个选项时可能需要调整。(vitejs)

10. 破坏性（Breaking）更改页面

    • Vite 官方新增一个 “破坏性更改（Breaking Changes）” 页面，用来列出所有重大 /已移除 /弃用的 API。(vitejs)
    • 建议在升级时对照这个页面确认是否有你项目中使用并受影响的 API。

升级 /迁移建议（给你这种有 React/Vue + TS 项目经验的人）

• 升级前先看 Vite 6 的迁移指南（Migration Guide） ，特别注意 resolve.conditions、Sass 配置、JSON 配置、library 模式 CSS 名称。(vitejs)
• 如果你的项目是库（library），并且依赖 CSS 输出名字（style.css），需要检查 build.lib.cssFileName 是否已设置正确。
• 如果你用 Sass / SCSS，检查你是否有使用 legacy API。如果是的话，要考虑迁移到现代 API，或者继续兼容 legacy，但要注意未来（Vite 7）兼容性。
• 检查 PostCSS 配置：如果你是用 TS 写 PostCSS config 或 YAML config，要适配新的 postcss-load-config 要求。
• 如果你用 SSR（服务端渲染）或自定义环境（比如边缘环境 / serverless），可以考虑利用新的 Environment API，但注意它还是实验性的。
• 执行完整的打包 /构建 /开发测试（特别是 “build” 模式、SSR 模式）来看是否有问题。