借助AI，1周，0后端成本，我开源了一款Office预览SDK

今天给大家分享一款我借助AI，开发的一款开源 Office 文件预览SDK。

我把它起名叫 jit-Viewer，刚好和我们做的 JitWord 协同AI文档相呼应。它主要的功能就是可以在浏览器中一键预览 Docx，PDF，Excel，PPT，Markdown，Txt等各种格式的文件。

同时只需要3行代码，就可以轻松集成到Vue，React，Angular，Html项目中。话不多说，先上开源地址。

github：github.com/jitOffice/j...

国内镜像：gitee.com/lowcode-chi...

演示地址：jitword.com/jit-viewer....

核心功能亮点

jit-viewer 不依赖后端转换，而是直接在浏览器端解析 Office Open XML 格式（.docx/.xlsx/.pptx 的底层结构），最后通过 jit-viewer 封装的渲染器渲染成可视化组件。PDF 预览则是基于 PDF.js 做深度优化。

所以我们完全不依赖后端，同时目前支持的文件预览方式有：

本地上传文件
通过url地址直接预览文件

这2种方式基本上是用户需求最多的方式。

总结几个核心亮点，方便大家参考评估：

零后端依赖，纯前端渲染：无需配置任何后端服务，静态站点也能用
框架无绑定：一个SDK同时支持Vue/React/Angular，团队技术栈切换无成本
隐私安全：文件解析在浏览器本地完成，不上传服务器
性能优异：虚拟滚动 + Web Worker，大文件不卡主线程
扩展性强：插件化架构，可自定义渲染器、添加水印、集成审批流

这里我在补充一条，目前预览访问不仅能在PC端预览，还能直接在移动端预览：

充分满足大家移动办公的需求。

同时为了提供开发人员对预览的样式控制，我还支持了预览控件：

下载文件
缩放重置
旋转功能
全屏
主题切换
获取文档信息

后续会持续优化一些更可控的功能供大家使用。

如何本地使用

我在 jit-viewer 文档中写了详细的本地使用教程，接下来给大家分享一下。

第一步，引入SDK：

js 复制代码

<!-- 引入样式文件 -->
<link rel="stylesheet" href="jit-viewer.min.css">

<!-- 引入 JitViewer SDK -->
<script src="jit-viewer.min.js"></script>

第二步，创建预览容器：

html 复制代码

<div id="viewer" style="width: 100%; height: 600px;"></div>

第三步，初始化实例：

js 复制代码

// 创建预览器实例
const viewer = JitViewer.createViewer({
  file: 'document.pdf',      // 文件 URL
  filename: 'document.pdf',  // 文件名（可选）
  toolbar: true,             // 显示工具栏
  theme: 'light',            // 主题
  width: '100%',
  height: '600px',
  onReady: () => console.log('准备就绪'),
  onLoad: () => console.log('加载完成'),
  onError: (err) => console.error('错误:', err)
});

// 挂载到 DOM
viewer.mount('#viewer');

是不是非常简单？只需要3步，就能快速集成到你的系统中实现 Office 文件预览功能。

我在文档中也写了详细的API介绍，大家想定制SDK样式和交互，也可以参考文档：

文档地址：jitword.com/jit-viewer....

小小总结一下

之所以要做这个项目，完全来自于之前的客户的一个需求，为了给我们的客户赋能，我们便做了这个开源SDK。

后续会继续迭代优化，实现更多文件类型的预览功能，大家有好的建议也欢迎留言区交流反馈～

对于AI，其实并不是全程参与开发（尤其是复杂的业务需求），大家短期内还是不用太神话AI的能力。

对于SDK的工程化方案（脚手架），我是完全交给AI来实现的，同时从文档的编写，网站demo的设计，也都是交给AI做的，到这里，AI基本能代替40%左右的工作了。

我提供的是SDK的产品需求，设计思路，技术选型，和设计风格，同时兼顾测试工程师的角色，这块其实是目前AI人机协作的常态。

所以技术能力还是需要，用好AI可能更好的为我们的工作和产品研发提效。

新的竞争力 在于：架构设计的品味、安全风险的嗅觉、人机协作的智慧，以及对自己代码的深刻理解。

github：github.com/jitOffice/j...

国内镜像：gitee.com/lowcode-chi...