企业官网建设流程全解析

三步在本地跑通 Univer：把电子表格与文档编辑嵌入你的产品

【免费下载链接】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 是一套开源的全栈框架，让电子表格、文档、演示文稿在你的产品里可编辑，同一套代码跑在浏览器和 Node.js。读完后你本地能跑起 demo，也知道改公式、改界面时该进哪个目录。

🎯 它解决什么问题

• 可嵌入的 SDK，而不是云服务：现成表格组件要么 UI 固定改不动，要么必须让用户登录它家的云。Univer 是前端 SDK，界面外壳、交互流程、功能集都由你自己拼装。
• 浏览器与服务端跑同一份代码：同一套Facade API在浏览器和 Node.js 里行为一致，服务端可以无界面地批量算公式、读写工作簿，即headless 模式。
• 三类文档共用一套底座：表格、文档、演示文稿复用同一套Canvas 渲染与插件架构，新增文档类型不用换技术栈。

下面是本地 demo 里运行中的表格实例，工具栏、公式栏、网格、工作表标签齐全。

⚙️ 本地跑起来的最小路径

第一步，克隆仓库并进入目录：

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

第二步，安装依赖，需要 Node.js 22.18 及以上：

pnpm install

第三步，启动演示站点：

pnpm dev

examples 示例站点会编译启动，打开浏览器里的本地地址，就能看到 sheets、docs、slides、多实例等各个 demo 入口。

📊 最值得试的几个功能

文档富文本编辑

当你要在产品里放一个 Word 式编辑器时，文档模块对应这个需求：工具栏支持加粗、上下标、高亮、对齐、缩进，页面按纸张形式渲染，保留页边距与文字流。

公式与数据筛选

当单元格里需要写公式并立刻出结果时，公式引擎负责解析与计算；截图里表格经过筛选，左下角单元格显示的就是求和公式的结果。

暗色主题适配

当你的产品要做 dark mode 时，渲染引擎和 UI 组件整体切换主题，截图里的区域弹出层、加载态都在主题体系内，不用逐处改色。

🧭 想改代码时看哪里

• packages/engine-formula/：想加或改公式函数，解析器和计算逻辑在这。
• packages/sheets-ui/：表格工具栏、菜单、右键菜单等界面交互在这。
• packages/engine-render/：单元格绘制、滚动、Canvas 渲染在这。

三者依赖关系可以用这张图理解：UI 层的 controller 调用 services，services 落到 core。

👥 谁在用、用来做什么

• SaaS 产品开发者在客户数据页里嵌一张可编辑表格：Preset 模式几行代码就能拼出能用的表格实例，需要控制包体时再手动组合插件。
• 服务端自动化工程师批量算公式、转换工作簿：headless 模式跑在 Node.js，API 与浏览器侧一致，不用为服务端另写一套逻辑。
• AI 应用开发者把 agent 的结构化产出写进文档：文档逻辑放在服务端跑，前端只负责渲染和交互。

📚 继续深入

• examples/：sheets、docs、slides、多实例、Web Component 等组合的完整可跑 demo，适合想看集成方式的人。
• docs/：API 稳定性策略、同构说明等约定文档，适合评估长期维护成本的人。
• presets/ 目录里的预设插件集合，适合想快速拿到最小可用实例的人。

Univer 的价值在于把"办公编辑"从成品应用变成可拆装的 SDK：插件按需增减，同一份代码同时落在浏览器与服务端。可以先打开 examples/ 里的 preset-sheets-core 入口跑一遍，再决定自己的产品要装哪些插件。

核心关键词：Univer、电子表格开源框架、文档编辑 SDK、headless 表格、插件架构

【免费下载链接】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