Framework open-slide 为智能体打造的幻灯片生成框架

做技术分享最耗时的不是写内容，而是调 PPT：对齐、配色、导出格式不统一。open-slide 把这件事交给智能体——它是一套“为 agent 打造的幻灯片框架”，你用 Markdown 描述内容，agent 生成结构，浏览器内即可预览、检查、再导出成 HTML/PDF/PPTX。

项目基本信息

一、项目介绍

open-slide/open-slide 是一个面向智能体的幻灯片框架，核心是用 React 构建、可在浏览器中实时预览与编辑。它的卖点是“agent-native authoring”：开发者或 AI 助手用声明式方式描述幻灯片，框架负责渲染、演讲者模式与多格式导出。仓库还内置资源管理与 svgl 图标搜索，降低做幻灯片的素材成本。

二、核心优势

1. agent 原生：把幻灯片当作可被 agent 生成与修改的结构化文档。
2. 浏览器内检查器：实时预览、就地调试样式与布局。
3. 多格式导出：静态 HTML、PDF、PPTX 一次生成。
4. 资源友好：内置 assets 管理器与 svgl 图标检索。
5. 专业演讲模式：支持 present mode，可直接用于演示。

三、适用场景

• 技术分享/课程幻灯片的快速产出。
• 让 AI 助手根据大纲自动生成可编辑幻灯片。
• 需要统一 HTML/PDF/PPTX 三种交付格式的场景。

四、安装教程

用官方 CLI 初始化项目：

npx @open-slide/cli init my-slide
cd my-slide
pnpm dev

本地开发（含核心包调试）：

pnpm install
pnpm dev        # 运行 demo
pnpm build      # 构建所有包
pnpm check      # 类型检查

常见报错：pnpm 未安装会提示 command not found，先 npm i -g pnpm；若 dev 端口被占，在配置里改端口后重启。

五、使用示例

初始化后，在幻灯片源文件中用声明式结构描述内容，agent 可基于大纲生成页面。开发态下浏览器会实时渲染：

pnpm dev

真实效果：左侧编辑声明式内容，右侧浏览器同步预览；完成后执行导出：

pnpm build      # 产物含静态 HTML
# PDF / PPTX 由导出流程生成

agent 模式下，你只需给“主题 + 大纲”，框架即可产出结构正确、可在演讲模式播放的幻灯片。

六、常见问题

Q：导出的 PPTX 能二次编辑吗？
A：PPTX 为标准格式，可在 PowerPoint/Keynote 中继续调整。

Q：必须联网吗？
A：开发态需要拉取依赖；导出后的静态 HTML 可离线打开。

Q：和 reveal.js 有何不同？
A：open-slide 强调 agent 生成与多格式一体化导出，而 reveal.js 更偏手写演示。

七、总结

open-slide 把“做幻灯片”变成“描述内容 + agent 生成 + 一键导出”，显著降低了技术演示的产出成本。对经常要做分享的工程师，它是一个值得加入工具链的框架，MIT 协议开源。