2026-08-06
更新概览
- React SPA 模板:升级到 Vite 8.2.0、React 19.2.8、React Router DOM 7.18.2、Axios 1.19.0,并完成 Vite DevTools 0.4 依赖树迁移。
- Vue 3 SPA 模板:升级到 Vite 8.2.0、Axios 1.19.0、Vue DevTools 8.2.1 和 Oxc 工具链新版本。
- React SSR 模板:升级到 Next.js 16.3.0、React 19.2.8、Axios 1.19.0,继续保留兼容的 ESLint 9 基线。
- Vue 3 SSR 模板:升级到 Nuxt 4.5.1、TanStack Vue Table 9、Axios 1.19.0;Pinia 4 与
@pinia/nuxt1.0 因生产 SSR 回归未采用。 - 四套模板:包管理器统一升级到 pnpm 11.20.0,Playwright 升级到 1.62.1,测试 DOM 与无障碍工具完成 major 升级。
- 本次验证:四套模板均通过安装、peer 检查、类型检查、lint、单测、覆盖率、组件守卫、生产构建和 Playwright E2E。
Vite 8.2.0 主要提升
Vite 8.2.0 是从 8.1.5 升级的 minor 版本,继续以 Rolldown 为构建内核。此次更新的重点是完善入口配置、bundled dev/HMR、诊断信息和边缘场景正确性;官方变更记录没有给出可直接套用于所有项目的构建耗时或产物体积提升数据,因此这里不使用未经模板实测支持的性能百分比。
| 范围 | Vite 8.2.0 官方变更 | 对 CWA 模板的意义 |
|---|---|---|
| 应用入口 | 新增顶层 input 配置;入口可经过插件解析,并自动加入 server.fs.allow。 | 多页应用或非标准 HTML 入口以后可直接声明 input,减少分别维护开发服务器文件白名单与构建入口的配置。当前两个 SPA 模板继续使用标准 index.html,无需迁移。 |
| bundled dev 与 HMR | bundled dev 改用客户端 HMR;worker 文件更新可由 HMR 接受,重建后只触发一次 reload,HMR 构建失败时会把错误输出到终端。 | 启用 bundled dev 的大型项目可以获得更连续的 worker 调试和更明确的失败反馈;CWA 当前默认开发模式不依赖该能力,因此升级不会改变既有热更新路径。 |
| 开发服务器可观察性 | 网络访问地址会标记网卡接口名称,显式 host 也能解析对应接口。 | 多网卡、虚拟网卡或局域网联调时,更容易判断终端中每个访问地址对应的网络接口。 |
| 配置诊断 | 原生配置加载器不兼容警告增加列号;bundle loader 会提示原生加载器不支持的特性,同时避免把虚拟模块误报为不兼容。 | vite.config 出现兼容性问题时,定位从文件/行细化到列;模板插件较多,诊断信息比笼统报错更有用。 |
| CSS 与构建正确性 | 修复 CSS chunk 在 chunk import map 中的映射、PostCSS OnceExit 注入内容的 URL 重写,以及插件解析顶层入口等问题。 | Tailwind、Autoprefixer、压缩和 legacy 插件组合下的 CSS 资源引用更稳健,尤其有利于代码分割和插件注入 CSS 的项目。 |
| HMR 与模块解析稳定性 | 服务重启时保留 environment snapshot;prune 后清理 hot data;修复优化依赖文件中的 interop import、带 base 的 HTML 模块图查找、符号链接根目录归一化等边缘场景。 | 降低复杂插件链、依赖预构建、非根路径部署和符号链接工作区中出现陈旧 HMR 状态或模块解析偏差的概率。 |
| 依赖优化性能 | 依赖优化器优先检查主流包管理器锁文件;忽略相关警告时跳过不必要的原生配置兼容检查。 | 常规 pnpm 项目的依赖扫描与配置加载减少无效检查,但实际收益取决于项目规模,本次不声明固定加速比例。 |
| 类型与平台能力 | 导出 PostCSS 配置类型;扩展 WebAssembly 测试并支持解包 WebAssembly.Global 与 JS string builtins。 | 自定义 PostCSS 配置可以获得更直接的类型约束;使用较新 WebAssembly 特性的项目具备更完整的工具链支持。 |
CWA 适配结论
- React SPA 与 Vue 3 SPA 的现有
index.html入口、Vite 插件顺序和环境变量开关不需要因 8.2.0 调整。 - 两个模板都使用
rolldownOptions,并组合 Tailwind CSS、legacy、压缩、DevTools 与 code-inspector 插件;类型检查、单测、生产构建和真实浏览器 E2E 均已通过。 @vitejs/devtools与 kit 同步到 0.4.12,并移除只存在 0.3.x 的 self-inspect 包,解决的是 Vite 8.2 peer 依赖一致性,不属于 Vite 核心运行时的新功能。- 主要依据为 Vite 8.2.0 Changelog 和 Vite 8.1.5...8.2.0 官方差异。
React SPA 模板 (vite_react_init)
依赖版本变更
| 依赖或工具 | 旧版本 | 新版本 | 类型 | 影响说明 |
|---|---|---|---|---|
| pnpm | 11.10.0 | 11.20.0 | toolchain | 使用新版 supply-chain 校验和构建脚本白名单。 |
| Vite | 8.1.5 | 8.2.0 | minor | 构建内核升级;生产构建和 legacy 产物通过验证。 |
| React / React DOM | 19.2.7 | 19.2.8 | patch | React 运行时保持同一稳定版本线。 |
| React Router DOM | 7.18.1 | 7.18.2 | patch | 路由守卫、登录跳转和 404 E2E 均通过。 |
| Axios | 1.18.1 | 1.19.0 | minor | 返回类型收紧,统一 request wrapper 显式声明响应拦截器的 data 解包边界。 |
| web-vitals | 5.3.0 | 6.0.1 | major | observer API 与现有监控测试兼容,注释同步为 v6。 |
| radix-ui / lucide-react / shadcn | 1.6.2 / 1.25.0 / 4.13.1 | 1.6.7 / 1.28.0 / 4.16.1 | minor/patch | UI 依赖更新,现有组件与 a11y 测试通过。 |
| @vitejs/devtools / kit | 0.3.4 | 0.4.12 | minor | 与 Vite 8.2 peer 范围对齐。 |
| @vitejs/devtools-self-inspect | 0.3.4 | 移除 | tooling | 该包没有 0.4 版本且会拉入旧 DevTools 依赖树;正式 DevTools 功能保留。 |
| code-inspector-plugin | 1.6.5 | 2.0.7 | major | 插件导出兼容;新增原生依赖 node-pty 的受信构建配置。 |
| jest-dom / jest-axe / jsdom | 6.9.1 / 10.0.0 / 29.1.1 | 7.0.0 / 11.0.0 / 30.0.1 | major | DOM 与无障碍测试 40 项全部通过。 |
| Playwright | 1.61.1 | 1.62.1 | minor | Chromium 生产预览 E2E 3 项通过。 |
| ESLint / Antfu / eslint-react | 10.7.0 / 9.1.0 / 5.11.2 | 10.8.0 / 9.2.0 / 5.18.2 | minor/patch | lint 零错误通过。 |
| 其他开发依赖 | 多版本 | 最新兼容版本 | minor/patch | 包括 Vite React/legacy 插件、React 类型、Less、lint-staged、react-grab 和升级通知插件。 |
升级内容说明
- Vite 8.2 要求
@vitejs/devtools0.4;移除仅有 0.3 版本的 self-inspect 后,依赖树不再同时存在 DevTools 0.3/0.4,pnpm peers check通过。 - Axios 1.19 无法从响应拦截器推断
response.data的实际返回类型,模板在共享 request wrapper 中集中声明该契约,没有把断言扩散到业务代码。 - web-vitals 6 继续使用 CLS、FCP、INP、LCP、TTFB observer,现有监控单测覆盖注册与不支持环境分支。
模板影响
- 路由、认证、组件和构建配置的行为保持不变。
- Vite DevTools 正式入口继续由
VITE_ENABLE_DEVTOOLS=true开启;不再加载仅用于 DevTools 自调试的 self-inspect 插件。
Vue 3 SPA 模板 (vite_vue3_init)
依赖版本变更
| 依赖或工具 | 旧版本 | 新版本 | 类型 | 影响说明 |
|---|---|---|---|---|
| pnpm | 11.10.0 | 11.20.0 | toolchain | 与其他模板统一包管理器基线。 |
| Vite | 8.1.5 | 8.2.0 | minor | Rolldown 构建与 legacy 产物通过验证。 |
| Axios / web-vitals | 1.18.1 / 5.3.0 | 1.19.0 / 6.0.1 | minor/major | 请求封装、性能监控测试与构建通过。 |
| Vue DevTools API / plugin | 8.1.5 | 8.2.1 | minor | Vue DevTools 生态保持同版本组合。 |
| @vitejs/devtools / kit | 0.3.4 | 0.4.12 | minor | 对齐 Vite 8.2 peer 范围。 |
| @vitejs/devtools-self-inspect | 0.3.4 | 移除 | tooling | 避免旧 DevTools 0.3 依赖树与新版并存。 |
| code-inspector-plugin | 1.6.5 | 2.0.7 | major | 保留源码定位能力并允许 node-pty 构建脚本。 |
| jest-dom / jest-axe / jsdom | 6.9.1 / 10.0.0 / 29.1.1 | 7.0.0 / 11.0.0 / 30.0.1 | major | 29 项测试与 a11y 用例通过。 |
| Oxlint / oxfmt | 1.74.0 / 0.59.0 | 1.77.0 / 0.62.0 | minor | lint 与格式工具基线升级。 |
| Playwright | 1.61.1 | 1.62.1 | minor | 生产预览 E2E 3 项通过。 |
| 其他生态依赖 | 多版本 | 最新兼容版本 | minor/patch | 包括 VueUse、Lucide Vue、shadcn-vue、vue-tsc、lint-staged、legacy 与升级通知插件。 |
升级内容说明
- Vite DevTools 采用与 React SPA 相同的 0.4 单一依赖树;Vue DevTools 8.2.1 保持独立开关。
- Vue、Vue Router 与 Pinia 的现有版本已经是模板兼容基线,本次不做无差异改写。
模板影响
- Composition API、路由、Pinia 注册和客户端渲染边界没有源码迁移。
VITE_ENABLE_DEVTOOLS、VITE_ENABLE_VUE_DEVTOOLS与 code-inspector 开关保持可独立控制。
React SSR 模板 (vite_react_ssr_init)
依赖版本变更
| 依赖或工具 | 旧版本 | 新版本 | 类型 | 影响说明 |
|---|---|---|---|---|
| pnpm | 11.10.0 | 11.20.0 | toolchain | 与四模板统一。 |
| Next.js / eslint-config-next | 16.2.10 | 16.3.0 | minor | App Router 生产构建、服务端启动和 E2E 通过。 |
| React / React DOM | 19.2.7 | 19.2.8 | patch | 与 Next 16.3 peer 范围兼容。 |
| Axios | 1.18.1 | 1.19.0 | minor | 服务端与客户端共享请求基线更新。 |
| radix-ui / lucide-react / shadcn | 1.6.2 / 1.25.0 / 4.13.1 | 1.6.7 / 1.28.0 / 4.16.1 | minor/patch | UI 与组件测试通过。 |
| code-inspector-plugin | 1.6.5 | 2.0.7 | major | Next 配置导出兼容,并允许 node-pty 构建脚本。 |
| jest-dom / jest-axe / jsdom | 6.9.1 / 10.0.0 / 29.1.1 | 7.0.0 / 11.0.0 / 30.0.1 | major | 17 项测试和覆盖率门禁通过。 |
| Playwright | 1.61.1 | 1.62.1 | minor | 生产 SSR、登录与 404 E2E 3 项通过。 |
| oxfmt / Sass / lint-staged | 0.59.0 / 1.101.3 / 17.0.8 | 0.62.0 / 1.102.0 / 17.3.0 | minor | 格式、样式与提交工具链更新。 |
| React 类型与 Vite React 插件 | 多版本 | 最新兼容版本 | patch | 类型检查和测试工具兼容。 |
升级内容说明
- Next.js 16.3.0 的 Node 要求为
>=20.9.0,模板 Node 24.18.0 基线满足要求。 - ESLint 10 未采用:Next 依赖的
eslint-plugin-react最新版仍只声明到 ESLint 9,因此保留 ESLint 9.39.5。 - Server Component 继续作为默认边界;交互组件才使用
"use client",浏览器 API 不进入服务端渲染路径。
模板影响
- Next 生产构建、服务端启动、首屏渲染、登录 hydration 和 404 路由均通过。
- 特权请求和密钥相关代码继续留在
src/server,本次未改变路由或服务端边界。
Vue 3 SSR 模板 (vite_vue3_ssr_init)
依赖版本变更
| 依赖或工具 | 旧版本 | 新版本 | 类型 | 影响说明 |
|---|---|---|---|---|
| pnpm | 11.10.0 | 11.20.0 | toolchain | 与四模板统一。 |
| Nuxt | 4.5.0 | 4.5.1 | patch | Nitro、Vite 8.2 和 Vue 3.5 生产组合通过。 |
| @tanstack/vue-table | 8.21.3 | 9.0.0 | major | table utils 类型检查、组件守卫、构建和 E2E 通过。 |
| Axios / VueUse | 1.18.1 / 14.3.0 | 1.19.0 / 14.4.0 | minor | 共享请求与组合式工具更新。 |
| Lucide Vue / shadcn-vue | 1.25.0 / 2.8.0 | 1.28.0 / 2.8.1 | minor/patch | UI 组件测试通过。 |
| @nuxt/test-utils | 4.0.0 | 4.1.0 | minor | 与 Nuxt/Vitest 组合兼容。 |
| jest-dom / jest-axe / jsdom | 6.9.1 / 10.0.0 / 29.1.1 | 7.0.0 / 11.0.0 / 30.0.1 | major | 13 项测试与覆盖率门禁通过。 |
| code-inspector-plugin | 1.6.5 | 2.0.7 | major | Nuxt Vite 插件配置兼容,并允许 node-pty 构建脚本。 |
| Oxlint / ESLint / oxfmt | 1.74.0 / 10.7.0 / 0.59.0 | 1.77.0 / 10.8.0 / 0.62.0 | minor/patch | Oxlint 零 warning,ESLint 仅保留既有 2 条建议。 |
| Playwright | 1.61.1 | 1.62.1 | minor | 生产 SSR、登录 hydration 与 404 E2E 3 项通过。 |
| 其他开发依赖 | 多版本 | 最新兼容版本 | minor/patch | 包括 TypeScript ESLint parser、vue-tsc、Sass、lint-staged 和 user-event。 |
升级内容说明
- 尝试升级 Pinia 3.0.4 -> 4.0.2 与
@pinia/nuxt0.11.3 -> 1.0.1。类型检查、单测和构建均通过,但生产预览在app:rendered钩子读取未注入的$pinia.state,导致首屏 500。 - 官方 latest 组合没有可用修复版本,因此最终保留 Pinia 3.0.4 与
@pinia/nuxt0.11.3;回退后生产 SSR E2E 通过。 - 浏览器行为继续放在
.client插件、onMounted或import.meta.client保护中,服务端代码继续留在src/server。
模板影响
- Nuxt 4.5.1 与 TanStack Vue Table 9 已通过类型、构建和真实 SSR 路径验证。
- Pinia 状态序列化继续使用已验证的 3.x/0.11 组合,避免 hydration 前的服务端 500。
文档与锁文件
- 四套模板的
package.json、pnpm-lock.yaml、README 和 AGENTS 已按最终版本同步。 - pnpm 增量更新锁文件,未删除或整体重建;
pnpm-workspace.yaml增加node-pty: true,明确允许 code-inspector 2 的原生终端依赖构建。 - 两套 SPA 移除
@vitejs/devtools-self-inspect及对应 Vite 配置,消除 DevTools 0.3/0.4 双版本 peer 冲突。 cwa-docs的四模板长期文档和日志标题索引已同步。create-wl-app保持 1.0.8;四个模板标识、仓库映射和交互分组无需修改。
验证结果
| 模板 | 单测 | 覆盖率 statements | 组件守卫 | E2E | 其他门禁 |
|---|---|---|---|---|---|
| React SPA | 15 files / 40 tests | 79.52% | 19 components | 3 passed | install、peers、typecheck、lint、build 通过 |
| Vue 3 SPA | 14 files / 29 tests | 79.22% | 19 components | 3 passed | install、peers、typecheck、lint、build 通过 |
| React SSR | 11 files / 17 tests | 93.97% | 13 components | 3 passed | install、peers、typecheck、lint、Next build 通过 |
| Vue 3 SSR | 8 files / 13 tests | 93.33% | 27 components | 3 passed | install、peers、typecheck、lint、Nuxt build 通过 |
- CLI 只读验证:
--version、--help、list均以 0 退出,list 输出四个预期模板映射。 - 文档站:
npm run build通过。
注意事项
- TypeScript 7.0.2 未采用:
@typescript-eslint/parser8.66.0 要求 TypeScript<6.1.0,四模板继续使用 6.0.3。 @types/node26 未采用:模板运行时固定 Node 24.18.0,因此继续使用 24.13.3。- React SSR 的 ESLint 10 候选未采用,原因是 Next 插件链中的
eslint-plugin-reactpeer 范围尚未包含 10。 - React SPA 安装仍提示既有
intersection-observer@0.12.2弃用;Vue SPA 与 Vue SSR 仍提示 6 个既有间接依赖弃用,均不阻塞安装和运行。 - React SSR lint 保留 3 条、Vue SSR lint 保留 2 条既有 Tailwind 任意值简化建议,均为 warning 且命令以 0 退出。
- Nuxt 构建仍输出插件耗时提示;Playwright WebServer 仍输出
NO_COLOR被FORCE_COLOR覆盖提示,均不阻塞构建或 E2E。 cwa-docs构建仍提示主 JavaScript chunk 超过 500 kB;这是现有文档站拆包建议,不阻塞本次日志与长期文档发布。- Playwright 1.62 首次本地 E2E 需要 Chromium 1234;官方 headless shell 下载多次中断后使用同一官方 URL 断点续传完成,随后四模板 E2E 全部通过。该事件仅影响本机测试缓存,不产生仓库文件。
参考依据
- npm registry 的版本、engines 与 peerDependencies 元数据。
- Vite 文档
- Next.js 文档
- Nuxt 文档
- Pinia Nuxt SSR 文档
- 四套模板在 Node.js 24.18.0 下的本地质量门禁与生产 E2E 结果。
