Skip to content
2026-09-17ARCHITECTURE约 12 分钟阅读

CLIENT / SERVER SYSTEM

脚手架从 SPA 扩展到客户端与服务端协同的企业级应用架构。

  • Vite
  • Oxc
  • React
  • Vue
  • Pinia
  • Zustand
  • Next.js
  • Nuxt

2026-09-17 ​

更新概览 ​

  • React SPA 模板:升级 React Router、Lucide、Vite DevTools、Vitest、Autoprefixer 与质量工具,并修复会话登录和 404 行为。
  • Vue 3 SPA 模板:升级 Lucide、Vite/Vue 测试插件、Vitest、Oxc 工具链与 CSS 工具,并放宽对 Git 初始化的无关限制。
  • React SSR 模板:升级 Next.js 16.3.5、Vitest、样式和开发工具;登录改为服务端 HttpOnly Cookie 会话。
  • Vue 3 SSR 模板:升级 Lucide、Vitest、Vue Test Utils、Oxc 与样式工具;登录改为 Nitro HttpOnly Cookie 会话。
  • 四模板统一采用 Node.js 24 LTS 分层策略和带完整性哈希的 pnpm 11.20.0。

React SPA 模板 (vite_react_init) ​

依赖版本变更 ​

依赖旧版本新版本类型影响说明
React Router DOM7.18.37.18.4patch路由守卫、登录回跳和 404 生产 E2E 通过。
lucide-react1.45.01.46.0minor图标组件测试与生产构建通过。
tailwind-merge3.6.03.7.0minorUI 组件测试与样式构建通过。
web-vitals6.2.16.2.2patch性能监控单元测试通过。
@vitejs/devtools / devtools-kit0.7.30.7.5patchVite 8.3.0 生产构建通过。
Vitest / UI / coverage-v85.0.05.0.1patch15 个测试文件、41 项测试和覆盖率门禁通过。
Autoprefixer10.5.610.6.1minorTailwind CSS 生产构建通过。
ESLint React / React Refresh5.19.0 / 0.5.65.19.1 / 0.5.7patchESLint 10.10.0 检查通过。
@types/node / code-inspector24.13.4 / 2.0.824.13.5 / 2.0.9patch类型检查和开发插件构建通过。

升级内容说明 ​

  • setToken(token, false) 现在会清除旧 localStorage Token,防止用户从“记住登录”切换到会话登录后留下持久凭据。
  • API base 和本地代理 target 改为必填环境变量,启动或构建时缺失配置会立即报错。
  • 404 路由不再被登录守卫提前拦截,未登录用户也能看到正确的 404 页面。
  • Tailwind、shadcn 和相关构建工具移到 devDependencies,运行时依赖只保留浏览器实际使用的包。

模板影响 ​

  • HashRouter、feature 路由聚合和 Zustand 状态边界保持不变。
  • pnpm test:e2e 在生产 preview 上完成登录、文档页与 404 共 3 项验证。

Vue 3 SPA 模板 (vite_vue3_init) ​

依赖版本变更 ​

依赖旧版本新版本类型影响说明
@lucide/vue1.45.01.46.0minor图标组件与生产构建通过。
tailwind-merge3.6.03.7.0minorshadcn-vue 组件测试通过。
web-vitals6.2.16.2.2patch性能工具测试通过。
@vitejs/devtools / devtools-kit0.7.30.7.5patchVite 8.3.0 生产构建通过。
@vitejs/plugin-vue6.0.86.0.9patchVue SFC 类型检查和构建通过。
Vitest / UI / coverage-v85.0.05.0.1patch14 个测试文件、30 项测试和覆盖率门禁通过。
Vue Test Utils2.5.02.5.1patch组件与无障碍测试通过。
Autoprefixer10.5.410.6.1minorTailwind CSS 生产构建通过。
Oxlint / oxfmt1.82.0 / 0.67.01.83.0 / 0.68.0minorlint 与格式检查通过。
@types/node / code-inspector24.13.4 / 2.0.824.13.5 / 2.0.9patch类型检查和开发插件构建通过。

升级内容说明 ​

  • 会话登录会主动清除旧 localStorage Token,与 React SPA 的持久化语义保持一致。
  • 启动和构建不再要求项目必须已执行 git init,生成后的压缩、legacy 与 DevTools 能力不受 Git 状态影响。
  • API base 和代理 target 改为必填环境变量,避免错误地址进入开发或生产构建。
  • Tailwind、shadcn-vue 和构建工具调整为开发依赖。

模板影响 ​

  • Vue Router、Pinia 和 feature 路由聚合方式保持不变。
  • pnpm test:e2e 在生产 preview 上完成公开文档页、登录回跳与 404 共 3 项验证。

React SSR 模板 (vite_react_ssr_init) ​

依赖版本变更 ​

依赖旧版本新版本类型影响说明
Next.js / eslint-config-next16.3.416.3.5patchApp Router 构建、Route Handler、Proxy 与生产 SSR E2E 通过。
lucide-react1.45.01.46.0minorUI 组件和构建通过。
tailwind-merge3.6.03.7.0minorTailwind CSS 组件测试通过。
Vitest / UI / coverage-v85.0.05.0.1patch13 个测试文件、22 项测试和覆盖率门禁通过。
oxfmt0.67.00.68.0minor格式检查通过。
Sass1.104.01.104.1patchNext.js 生产构建通过。
@types/node / code-inspector24.13.4 / 2.0.824.13.5 / 2.0.9patch类型检查和 Next.js 构建通过。

升级内容说明 ​

  • 登录由 src/app/api/session/route.ts 在服务端签发 HttpOnly、SameSite Cookie,浏览器不再保存访问 Token。
  • src/proxy.ts 在服务端保护 /docs,未登录访问会重定向到登录页。
  • request context 从请求 Cookie 读取会话,特权请求继续留在 src/server。

模板影响 ​

  • Server Component 仍是默认组件类型,交互组件才使用 "use client"。
  • 浏览器 API 不进入服务端渲染路径,生产构建生成静态页面、动态 session API 和 Proxy。
  • pnpm test:e2e 通过未登录重定向、生产 SSR 文档页、登录和 404 共 4 项验证,覆盖首屏渲染和 hydration 基线。

Vue 3 SSR 模板 (vite_vue3_ssr_init) ​

依赖版本变更 ​

依赖旧版本新版本类型影响说明
@lucide/vue1.45.01.46.0minorUI 组件和 Nuxt 生产构建通过。
tailwind-merge3.6.03.7.0minorshadcn-vue 组件测试通过。
@vitejs/plugin-vue6.0.86.0.9patchVue SFC 与 Nuxt 构建通过。
Vitest / UI / coverage-v85.0.05.0.1patch11 个测试文件、18 项测试和覆盖率门禁通过。
Vue Test Utils2.5.02.5.1patch组件与无障碍测试通过。
Oxlint / oxfmt1.82.0 / 0.67.01.83.0 / 0.68.0minorOxlint、ESLint 与格式检查通过。
Sass1.104.01.104.1patchNuxt 客户端和 Nitro 服务端构建通过。
@types/node / code-inspector24.13.4 / 2.0.824.13.5 / 2.0.9patchNuxt 类型检查和开发插件构建通过。

升级内容说明 ​

  • Nitro session API 在服务端写入 HttpOnly Cookie,服务端中间件保护 /docs。
  • serverDir 显式指向 src/server,确保 API、中间件和特权代码位于 Nuxt 服务端边界。
  • API Client 由 Nuxt 插件按请求通过 useRuntimeConfig() 创建,SSR 路径不再在共享模块顶层读取 process.env。

模板影响 ​

  • 浏览器行为继续放在 .client 插件、onMounted 或 import.meta.client 保护中。
  • Pinia、Nuxt 文件路由和 hydration 边界保持不变。
  • pnpm test:e2e 通过未登录重定向、生产 SSR 文档页、登录和 404 共 4 项验证。

Node.js、pnpm 与 CI ​

位置旧值新值用途
package.json#engines.node^24.18.0>=24.11.0 <25支持 Node 24 LTS 范围,避免固定某个补丁版本。
.nvmrc24.18.024本地开发跟随最新 24.x 安全补丁。
GitHub Actions24.18.024.11.0 + 24.x同时验证最低兼容版本和推荐版本。
packageManagerpnpm@11.20.0pnpm@11.20.0+sha512...固定锁文件解析器并校验 Corepack 下载产物。

CI 在 24.x 上运行完整 Playwright E2E,在最低版本上执行生产构建,减少重复的浏览器测试。

未采用的候选版本 ​

  • TypeScript 7.0.2 暂不直接替换 6.0.3。TypeScript 7 当前不提供编译器 API,官方建议需要该 API 的工具与 TypeScript 6 并行使用;模板中的 typescript-eslint 体系仍声明 TypeScript <6.1.0。
  • React SSR 暂时保留 ESLint 9.39.5。eslint-config-next@16.3.5 仍引入 eslint-plugin-react@7.37.5,其 peer 范围只支持到 ESLint ^9.7。
  • Vue SSR 保留稳定版 h3 1.15.11。npm 的较新候选为 2.0.1-rc.32,属于带迁移成本的预发布版本,不进入通用模板。
  • @types/node 使用明确的 Node 24 版本 24.13.5;npm 的 latest 标签当前指向 22.x,不能作为 Node 24 模板的升级依据。

文档与锁文件 ​

  • 四模板 package.json 和 pnpm-lock.yaml 已由 pnpm 同步更新,没有删除或重建锁文件。
  • README 同步实际版本、Node/pnpm 策略、认证边界和环境变量要求;AGENTS 保留 SPA/SSR 目录职责与验证命令。
  • 长期文档同步 Next.js 16.3.5 与本次日志标题;create-wl-app 的四个模板标识和仓库映射保持不变。

验证结果 ​

  • 四模板:冻结安装和 pnpm peers check --json 通过,均无 bad、missing 或 conflict。
  • 四模板:pnpm typecheck、pnpm lint、pnpm test、pnpm test:coverage、pnpm test:component-coverage 和 pnpm build 通过。
  • 格式检查:Vue SPA、React SSR、Vue SSR 的 pnpm format:check 通过;React SPA 使用 ESLint 格式规则并通过 lint。
  • 覆盖率:React SPA 79.60% statements,Vue SPA 79.31%,React SSR 96.42%,Vue SSR 95.41%,均高于现有门禁。
  • 组件测试守卫:React SPA 19、Vue SPA 19、React SSR 13、Vue SSR 27 个组件通过。
  • E2E:React SPA 3/3、Vue SPA 3/3、React SSR 4/4、Vue SSR 4/4 通过。
  • create-wl-app 的 --version、--help、list 和 cwa-docs 生产构建通过。

注意事项 ​

  • React SSR 安装时会提示 ESLint 9 已停止官方支持;当前 Next.js 插件 peer 约束仍阻止安全升级到 ESLint 10,该提示不阻塞模板安装、lint、构建和 E2E。
  • Nuxt 构建会输出插件耗时分析提示,构建与 Nitro 产物正常,不影响模板使用。
  • Playwright WebServer 输出 NO_COLOR 与 FORCE_COLOR 同时设置的 Node 警告,测试结果不受影响。

cwa-stack —— 开箱即用,极速响应,让开发更简单、更高效