[!info] related notes

• 所属：插件与 SSR MOC
• 相邻：React SSR/RSC · Hydration · 双路径

Vite SSR 概览

这个概念为什么出现

SSR 需要在 Node 中加载与浏览器共享的模块图。开发期若无统一转换，会出现“浏览器能 import，服务器不能”的分裂。Vite 提供 middleware 模式与 ssrLoadModule 等能力。

[!abstract] 一句话理解 Vite SSR 解决的是模块转换与开发集成；路由、数据、部署整体通常由上层框架补齐。

能力边界

• dev：middlewareMode 接入自有 Node 服务器
• 转换：服务端可加载/转换前端模块
• 生产：通常分别构建客户端与服务端入口，例如 vite build --outDir dist/client、vite build --ssr src/entry-server.ts --outDir dist/server；入口与渲染服务器需自行实现
• SSR manifest 需按需启用（客户端构建的 --ssrManifest），不是默认构建必有；生产服务器加载服务端产物，而非运行开发期 ssrLoadModule

工程注意

• 双端分支：window/document 不可在服务端碰
• 状态串用与内存泄漏（服务器单例）
• 业务通常选成熟框架承担路由与渲染集成；Nuxt、React Router 框架模式使用 Vite，Next.js 不是 Vite SSR 的封装
• ssrLoadModule 属于既有低层 SSR API；新框架集成还需核对 Environment API 与对应 Vite 版本

本节总结

把 Vite SSR 当基础设施层，不要误当成完整全栈框架。

自测题

1. 为什么 SSR 代码不能假设一定有 DOM？

参考答案

服务端执行环境是 Node（或同类），没有浏览器 DOM；访问会抛错或行为未定义。