Univer 部署终极指南：30 分钟把电子表格与文档协作系统上线生产环境-编程实验室

Univer 部署终极指南：30 分钟把电子表格与文档协作系统上线生产环境

【免费下载链接】univerUniver is a full-stack framework for creating and editing spreadsheets / word processor / presentation on both web and server.项目地址: https://gitcode.com/GitHub_Trending/un/univer

Univer 是一套覆盖电子表格、文档与幻灯片的企业级文档和数据协作框架。这篇 Univer 部署文章按"先看见终点、再动手"的思路，把整条路线拆成几段：本地开发环境怎么跑起来、生产静态文件怎么打包、Nginx 怎么配，最后附一份 CDN 加速、多实例与踩坑排障的清单。

Univer 是什么：先搞清楚它能解决什么问题

一句话说清：Univer 是面向企业级的文档与数据协作方案，电子表格、文档、幻灯片三种形态都能做。如果你要在 Web 端嵌入类 Excel 的在线表格、让多人协作编辑文档、或者渲染幻灯片，它就是为此设计的。理解这一点，后面每个部署步骤你都能对上号——本质上都是在为这套协作能力找落脚点。

生产部署长什么样：先看见终点

先把终点画出来：Univer 生产环境部署的产物就是一批纯静态文件，交给 Nginx 这类支持静态文件的 Web 服务器直接托管即可。用户访问你的域名，看到的就是一套完整可交互的电子表格页面。

这意味着 Univer 静态文件部署的思路很轻：把examples/local目录安全送到线上，再保证 SPA 路由和压缩不出错，基本就算上线了。接下来所有步骤都在服务这个终点。

本地 30 分钟跑起来：环境搭建与启动 🚀

这一节的目标只有一个：让 Univer 在本地开发环境里亲眼可见。

环境要求很简单：Node.js ≥ 20、pnpm ≥ 10、Git（装最新版就行）。Node 版本不对是最容易卡住的地方，这里我更推荐用 nvm 或 fnm 直接切到 20，再把 pnpm 全局装上。

git clone https://gitcode.com/GitHub_Trending/un/univer cd univer pnpm install pnpm dev

浏览器打开http://localhost:3000，示例页面就出来了。开发服务器自带热重载，改完代码页面自动刷新，后面调试用得上。

项目目录怎么读：核心结构速览

不用记整个仓库，抓住三个目录就够干活：核心代码和插件都住在 packages/，一项能力基本对应一个包；想看参考实现或改演示入口，翻 examples/ 即可；贡献约定和项目文档以 CONTRIBUTING.md 为准。架构资料放在 docs/ 里，common/、e2e/ 这些用到再查，不影响你走通部署主线。

构建并上线：从打包到 Nginx 部署 📦

本地确认没问题后，Univer 部署的打包环节就一条命令：pnpm build，产物落在examples/local目录，全是可直接托管的静态文件。想上线前先验一眼效果，可以跑pnpm build:demo配合pnpm serve:e2e，同样在http://localhost:3000预览。

上传服务器这一步很直接：scp -r examples/local user@your-server:/path/to/univer/。

Univer 的 Nginx 配置里真正决定成败的就几行：root 指到产物目录、SPA 路由用 try_files 兜底、开 gzip：

root /path/to/univer/examples/local; index index.html; location / { try_files $uri $uri/ /index.html; } gzip on; gzip_types text/css application/javascript application/json;

把配置放进/etc/nginx/conf.d/，sudo nginx -t通过后sudo systemctl restart nginx。最后用域名访问验证：页面能打开、刷新不 404，就算上线成功。

进阶玩法：CDN 加速与多实例

两个提效方向，按需取用。

国内用户访问慢，通常是静态资源走了远路。如果你直接用 Univer 的发布产物而不是自研构建，用国内 CDN 分发最省事，两行就接进 HTML：

<script src="https://cdn.bootcdn.net/ajax/libs/univer/0.10.10/univer.min.js"></script> <link href="https://cdn.bootcdn.net/ajax/libs/univer/0.10.10/univer.min.css" rel="stylesheet">

另一个高频需求是同一页面跑多个实例，比如多张表格并排协作。Univer 是支持的，抄 examples/src/sheets-multi/ 的实现就能起步。