开源办公神器OfficeHub:文档、表格、AI 于一体,还能搭知识库!

大家好,我是徐小夕。

架构师,曾任职多家上市公司,多年架构经验,打造过上亿用户规模的产品,目前全职创业,主要聚集于"Dooring AI零代码搭建平台"和"flowmixAI多模态办公软件"

之前和大家分享了我实现的 pxcharts 多维表格编辑器和协同文档编辑器:

  • px-doc,一款开箱即用的协同文档编辑器

  • pxcharts多维表格ultra版:AI + 多维表,工作效率飙升!

今天和大家分享一下我们花了半年打造的在线办公神器------OfficeHub

github地址:github.com/MrXujiang/O...

接下来我会从功能亮点技术架构如何本地运行部署这几个点,全面和大家分享这款开源办公项目。

OfficeHub介绍

作为每天跟各种办公软件打交道的技术博主,我一直觉得「在线办公工具」是个矛盾体:要么功能全但收费贵(比如某钉、某飞),要么免费但功能零散(比如单独的在线文档、独立的思维导图工具)。所以我们决定花半年时间打造 OfficeHub 这个项目,把「文档 + 表格 + 思维导图 + AI + 知识库」完美的融合成一个办公智能体。

核心定位:基于 Web 的开源在线办公协作平台,集成文档编辑、思维导图、电子表格、AI 创作、模板管理和知识库功能。

简单说,OfficeHub 想做的是「办公工具界的瑞士军刀」:不用切换多个平台,一个系统搞定从内容创作到知识沉淀的全流程。

OfficeHub功能亮点介绍

1. 「无缝衔接」的办公三件套

OfficeHub 的 doc 编辑器支持常见的格式排版、图片插入、表格嵌套,甚至能嵌入思维导图,可视化图表等复杂web组件。

思维导图工具支持节点拖拽、样式自定义,切换不同风格主题,还能导出成图片或 JSON文件。

电子表格则包含基础公式计算、数据筛选,应付日常办公完全够。

最关键的是「无缝切换」------ 在文档里插入表格、在文档里插入思维导图,内容互通不用反复导出导入,这点比用多个独立工具高效太多。

2. AI 创作不是「鸡肋」,而是「生产力」

很多工具的 AI 功能只是个摆设,但 OfficeHub 的 AI 模块有两个亮点:

场景化生成

写文档时能一键生成大纲、扩写内容;

自定义模型

支持接入自己的 AI 模型(比如通义千问 API),不用担心数据隐私,这点对企业用户太友好了。

3. 模板 + 知识库:让内容「活」起来

我们可以把常用的周报格式、会议纪要做成模板,团队成员直接复用;更有价值的是「基于文档生成知识库」------ 系统会自动提取文档,生成可自定义的知识库,新人入职查资料、老员工找历史记录都能省半小时。

4. 轻量化部署,不挑环境

作为 Web 项目,它不需要客户端安装,浏览器打开就能用。不管是个人电脑、服务器还是云平台,只要能跑 Node.js,部署起来都很轻松(后面会说具体步骤)。

OfficeHub技术栈

前端

  • 核心框架
  • Vue 3(用 Composition API 组合代码,比 Options API 更灵活)+ TypeScript(类型约束减少 bug);
  • 状态管理
  • Pinia(替代 Vuex,更简洁,支持 TypeScript);
  • 文档编辑
  • 基于 flowmix/docx多模态文档引擎构建;
  • 表格处理
  • 思维导图
  • 原生Js库 + Canvas 渲染(保证性能和交互流畅度)

后端

  • 运行时
  • Node.js(v14+,建议用 LTS 版本);
  • Web 框架
  • 自研服务端引擎(基于koa2,轻量灵活),也可兼容 NestJS(企业级架构);
  • 数据库
  • JSON结构化数据文件(文档型数据库,适合存储结构灵活的办公数据)
  • AI 集成
  • 通过 HTTP 客户端调用模型 API,支持自定义请求头和参数(方便接入私有模型)

OfficeHub本地部署运行

我们需要先clone项目:

bash 复制代码
git clone https://github.com/MrXujiang/OfficeHub.git
cd OfficeHub

然后安装对应的项目依赖:

arduino 复制代码
pnpm install
// 或者yarn和npm都可
yarn

最后直接执行启动命令即可:

sql 复制代码
pnpm start

这样我们在3000端口就可以访问了。

橙子轻文档

我们可以轻松将它作为企业或者团队内部的知识库系统来使用,也可以部署上线上供其他人使用。

github地址:github.com/MrXujiang/O...

当然还有很多功能我会在接下来的文章中和大家持续分享,如果大家有好的想法欢迎留言交流~

相关推荐
豆苗学前端9 分钟前
vue3+TypeScript 实现一个图片占位符生成器
前端·面试·github
neon120410 分钟前
Vue 3 父子组件通信核心机制详解:defineProps、defineEmits 与 defineExpose 完全指南
前端·javascript·vue.js·前端框架
Ciito16 分钟前
vue+moment将分钟调整为5的倍数(向下取整)
javascript·vue.js
Juchecar27 分钟前
Vue3 开发环境搭建及循序渐进学习指南
前端·javascript
Data_Adventure43 分钟前
@scqilin/phone-ui手机外观组件库
前端
一点一木1 小时前
Vue Vapor 事件机制深潜:从设计动机到源码解析
前端·vue.js·vapor
FSHOW1 小时前
记一次开源_大量SVG的高性能渲染
前端·react.js
小牛.7931 小时前
Web第二次作业
前端·javascript·css
二闹1 小时前
都2025了还要用Layui做下拉控件-我只能说你有水平
前端
Pikachu8031 小时前
揭秘 tyarn:一个为大型 TypeScript Monorepo 优化的 Yarn 性能猛兽
前端·javascript