--- slug: open-slide-agent-native-react-slides status: published title: open-slide 是什麼？讓 AI agent 用 React 寫簡報，再由框架處理播放與匯出 excerpt: open-slide 把簡報內容變成 React 元件：coding agent 負責寫頁面，框架負責 1920×1080 畫布、縮放、導覽、熱更新、視覺檢查與輸出。這篇從安裝、檔案契約到 agent workflow，整理它適合什麼工作。 category: Development cover: "/static/open-slide-agent-native-react-slides-cover.png" tags: [open-slide, React, coding-agent, presentation, Vite, TypeScript] author: Seer author_role: Author read_time: 13 min published_at: "2026-08-10T05:46:31Z" updated_at: "2026-08-10T05:54:15Z" --- ## open-slide 的定位：讓 agent 寫投影片，讓 runtime 處理投影片 [open-slide](https://github.com/1weiho/open-slide) 是一款專為 coding agent 設計、以 React 為核心的簡報框架。它的運作邏輯相當直覺：使用者以自然語言描述簡報需求，agent 負責生成 `slides//index.tsx` 檔案；後續的畫布縮放、投影片導覽、熱更新（HMR）、簡報播放模式以及檔案匯出等工作，則由 open-slide runtime 處理。 這樣的定位與傳統簡報工具有很大落差。open-slide 定位為簡報執行環境（runtime），負責提供穩定的機制供 agent 進行寫入、預覽、修改與交付。它本身不包含 AI 模型，亦不內建 LLM 對話式 agent。因為投影片本質上依然是 React 元件，除了手動修改程式碼，也可以搭配 Claude Code、Codex 或 Cursor 等具備程式碼編輯能力的 coding agent 來自動化調整。 在 open-slide 中，每頁投影片都以 **1920 × 1080** 的固定畫布呈現。你可以自由編寫任何 React 結構，不需受限於語法死板的簡報專用 DSL。這代表你的簡報將轉化為一組能納入版本控制（git version control）的前端專案，不再是只能在封閉式軟體 GUI 介面中拖拉的黑盒子。 本文依照目前官方 repository `main` 分支的 `3054b184a5ea8fc7858c56962817825d5ca138e2` commit 進行查核，相關套件版本對應為 `@open-slide/core` `1.17.1` 與 `@open-slide/cli` `1.4.1`。文中提及的指令與功能均取材自官方 README、文件、套件設定與原始碼，版本與功能邊界以這個查核時間點為準。 ## 先看重點 - **輸入契約**：以 `slides//index.tsx` 等模組為主，預設匯出（default export）一組 React `Page` 元件陣列。 - **投影片畫布**：尺寸固定為 1920 × 1080，運行時會根據瀏覽器視窗自動進行等比例縮放。 - **起手步驟**：透過 `npx @open-slide/cli init my-slide` 初始化專案，接著執行 `pnpm install` 與 `pnpm dev` 啟動開發伺服器。 - **Agent 工作流**：內建提供 `create-slide`、`slide-authoring`、`apply-comments`、`current-slide` 與 `create-theme` 等技能（skills）引導。 - **開發體驗**：支援 Vite 熱更新（HMR）、縮圖邊欄（thumbnail rail）、鍵盤導覽、瀏覽器內置檢查器（inspector）、講者備註、簡報者模式與資源管理器。 - **匯出格式**：官方文件已明確支援 static HTML 與 PDF；此外，專案原始碼中亦包含將投影片轉換為圖片並打包的 PPTX 匯出工具。 - **部署方式**：執行 `open-slide build` 可輸出靜態網頁，方便部署至 Vercel、Cloudflare Pages、Zeabur 或 Netlify 等靜態空間。 - **開源授權**：採用 MIT 授權條款。 - **重要限制**：該框架的主要作用是將 agent 產生的 React 轉化為可播放的簡報，並不保證簡報內容的品質或排版完全正確，且官方並未提供最低硬體規格與效能測試數據。 ## 它解決的是哪一段問題？ 在使用 AI agent 生成簡報的過程中，真正棘手的部分通常落在後續一連串繁雜的前端實作細節，而非單純寫出一段標題：如何維持畫布比例、各分頁的導覽切換、即時預覽、熱更新、全螢幕簡報模式、講者備註、圖片與字型的載入管理，以及最後該以何種格式交付。 open-slide 的出現正是為了解決這類共用的基礎建設問題。它讓 agent 能專注於調整內容、版面與 React 元件，而框架本身則打理好以下的工作劃分： | 階段任務 | open-slide 負責的部分 | 仍需人工或 Agent 判斷的部分 | | --- | --- | --- | | 專案初始化 | 建立專案骨架（scaffold workspace）與 starter slide 範本 | 簡報主題、目標受眾、總頁數與大綱結構 | | 頁面開發 | 自動載入並解析 `slides//index.tsx` 檔案中的 React 頁面 | 頁面具體內容、元件切版、文字精準度與正確性 | | 即時預覽 | 提供 1920 × 1080 畫布、等比例縮放、縮圖檢視與熱更新 | 檢查內容是否溢出、文字密度是否過高、視覺層級是否清晰 | | 內容修訂 | 提供瀏覽器檢查器、source marker（註解標記）與開發端 API | 評估本次修改是否會影響其他頁面的樣式或整體主視覺 | | 成果發表 | 支援全螢幕播放、簡報者模式、靜態編譯與 HTML/PDF 匯出 | 決定最終交付格式，並進行最後的人工檢驗 | 由此可見，open-slide 的核心價值在於將簡報生產轉化為可重複迭代的程式碼工作流：**生成程式碼 → 畫面預覽 → 標註修改需求 → 自動回寫原始碼 → 重新驗收**。這種設計將原本一鍵生成完美簡報的理想，落實為更具控制力的開發循環。 ## 從安裝到第一份 deck ### 1. 使用 CLI 建立工作區 根據官方文件說明的起手步驟： ```bash npx @open-slide/cli init my-slide cd my-slide pnpm install pnpm dev ``` `@open-slide/cli` 主要作為工作區初始化工具，會為你建立一個隨開即用的開發專案，目錄結構包含： - `slides/getting-started/`：初始投影片範例。 - `package.json`：宣告依賴套件 `@open-slide/core`。 - `open-slide.config.ts`：可選用的強型別設定檔。 - `.claude/skills/` 與 `.agents/skills/`：提供給 agent 的撰寫技能（skills）定義。 - `CLAUDE.md` / `AGENTS.md`：引導 agent 的開發指南文件。 - `assets/`、`themes/` 資料夾及其他相關設定檔。 在初始化專案時，CLI 也提供了幾項可調整工作流程的參數： ```bash open-slide init [dir] open-slide init --force open-slide init --name open-slide init --no-install open-slide init --no-git ``` 套件管理工具支援 npm、pnpm、Yarn 或 Bun。當指定的目標路徑非空資料夾時，初始化程序預設會中止以防止檔案遭到覆蓋，必須明確加上 `--force` 參數才會強制執行。這項保護措施讓你能在現有專案目錄旁安全地進行測試，不必擔心意外遺失既有資料。 ### 2. 撰寫投影片模組 每組投影片的進入點為： ```text slides//index.tsx ``` 最基本的投影片頁面結構如下： ```tsx import type { Page, SlideMeta } from '@open-slide/core'; const Cover: Page = () => (

Hello, open-slide

); export const meta: SlideMeta = { title: 'Hello, open-slide' }; export default [Cover] satisfies Page[]; ``` 開發時需遵循兩個核心規則：檔案的預設匯出（default export）必須是 `Page` 陣列，且每個頁面元件都應填滿 1920 × 1080 的父容器。你可以在同一個檔案中定義多個元件，陣列中的先後順序即代表投影片的播放順序。 透過 `SlideMeta`，你可以定義投影片標題、套用主題與建立時間；若需要引入可動態調整的樣式變數，也可以匯出 `DesignSystem`。官方 core API 還提供了 `MorphElement`、`Steps`、`Step`、頁碼 Hook 及轉場類型（transition types），方便實作跨頁面共享元素動畫、內容漸進式呈現以及細緻的頁面狀態切換。 ### 3. 讓 Agent 接手簡報撰寫 初始化專案時所產生的 skills，是 open-slide 與 coding agent 協作的核心橋樑。其中最常被調用的指令是 `/create-slide`： 1. 釐清簡報主題與受眾定位。 2. 確立美術設計風格。 3. 估算投影片頁數範圍。 4. 設定每頁投影片的文字密度。 5. 選擇動畫動態的複雜度（例如：無動畫、微動畫或豐富轉場特效）。 6. 規劃投影片結構角色（如封面頁、內容頁、對比頁、引言頁與結尾頁等）。 7. 將產出的程式碼寫入 `slides//index.tsx`。 相較於直接對 agent 下達籠統的「幫我做份簡報」，這種編排模式更具預測性，因為它在撰寫程式碼前，就先對可能影響整體排版風格的關鍵要素進行了決策收斂。若工作區內已配置了 theme 的 markdown 檔，`create-slide` 會優先讀取其中的調色盤（palette）、字型樣式、版面配置以及共用元件，確保新生成的簡報與整體風格保持一致。 此外，agent 輸出的內容是通俗易懂的 React 程式碼，避開了格式封閉的 JSON 設定檔。你可以將程式碼直接納入 Git 版本控制，藉由 diff 清楚比對每一頁的修改細節，更能在 agent 搭建好骨架後隨時接手微調。 ## 最有用的迭代迴圈：畫布上的 inspector 加上 source marker open-slide 最獨特的功能之一，莫過於其視覺化的檢查器（inspector）。在開發伺服器啟動後，你可以在畫布上直接點選元件，調整文字、字型大小、字重、顏色或更換圖片。這些變更一開始會暫存在記憶體中，直到點擊「Save」才會整批回寫至原始碼。 另一種修改途徑是透過程式碼註解（comment marker）來標記： ```tsx
{/* @slide-comment id="c-1234abcd" ts="2026-08-10T05:31:19Z" text="..." */}

Q2 Launch

``` 此處的 `text` 內容在實際運作時會是 base64url 編碼的 JSON，上方程式碼僅為概念示意，不需使用者手動編寫。在正常的使用流程下，只要在瀏覽器檢查器中輸入「將標題改為紅色」或「縮小此行文字」，工具便會自動將對應的 comment 插入對應的 JSX 位置。 接著，只要交由 agent 執行 `/apply-comments` 指令： 1. 掃描專案內所有 `slides/*/index.tsx` 中的 `@slide-comment` 標記。 2. 解碼註解內容，定位該標記所關聯的 JSX 包覆元素（enclosing element）。 3. 由後往前依行號套用變更。 4. 移除已處理完成的標記。 5. 重新讀取檔案，確認沒有留下未處理的 marker。 這建立起非常流暢的開發循環：**檢視畫面 → 點選元素標註意見 → agent 讀取並修改原始檔 → 重新整理確認效果**。相較於每次都要費心描述「第三頁右上角那個藍色區塊」，此模式在微調產品投影片或技術分享報告時，顯得更為精準且踏實。 ## Assets、theme 與 presenter mode ### 資源管理器（Assets Manager） 每組簡報都可以將專屬的圖片、影片及字型存放在該簡報目錄下的 `slides//assets/` 中；至於跨簡報通用的 logo 或個人頭像等資源，則可以放置於全域的 `assets/` 資料夾。 開發介面中整合了資源管理器，讓你能一覽簡報內使用的素材，並支援直接拖曳上傳、重新命名與替換資源，甚至整合了 [svgl](https://svgl.app/) 方便快速搜尋主流品牌的向量 logo。這種管理方式的好處在於，所有圖片與素材都能與投影片原始碼一同收納在專案中，免去了上傳外部圖床的麻煩，也無須塞在 prompt 裡傳遞。 專案中負責匯出靜態 HTML 的程式碼已支援辨識常見的媒體格式，包含 PNG、JPEG、GIF、SVG、WebP、AVIF 等圖片，MP4、WebM、MOV 影片，Woff、TTF 字型，以及 MP3、WAV、OGG 音訊副檔名。雖然這代表框架內建了資產打包機制，但不同瀏覽器對影片編碼、客製字型與外部樣式表的渲染結果可能存在差異，發布前仍建議在實際的目標瀏覽器進行測試。 ### 主題與設計系統 使用 `create-theme` 能為專案產出一套主題規範與展示元件，便於重複利用色彩配置（palette）、字型設定（typography）、版面樣式、頁首頁尾元件以及動畫原則。這裡的主題定義與單一簡報中的 `design` 變數在層級上有所區隔： - theme markdown：提供給 agent 作為開發時的視覺設計指引。 - `themes/.demo.tsx`：主要用於主題面板（Themes panel）中的視覺預覽。 - 簡報內的 `design`：屬於運行期間（runtime）可讀取並動態調整的設計 token。 如果你需要製作一系列符合品牌規範的投影片，建議先定義好主題，再引導 `/create-slide` 依循該主題生成內容，如此一來能有效避免每張投影片色彩或字型不一致的窘境。 ### 簡報者模式 open-slide 在運行時提供了全螢幕播放、鍵盤控制導覽、講者備註（speaker notes）、目前與下一頁投影片預覽，以及計時器等完整功能。投影片製作完成後，可以直接在瀏覽器中進入播放狀態，不需額外轉檔成傳統簡報格式即可登台報告。 不過，開發者需留意「簡報播放執行環境」與「最終簡報交付格式」的差異：此簡報者模式專注於瀏覽器端的播放體驗，與 Microsoft PowerPoint 的相容性不可等同視之；在不同瀏覽器與投影環境下仍需自行驗證。 ## 輸入與輸出格式怎麼看？ | 類別 | 官方文件與原始碼可驗證的實作 | 開發實務解讀 | | --- | --- | --- | | 投影片原始碼 | 以 `index.tsx` 等 React/TSX/JSX 模組為主，預設匯出 `Page[]` | 投影片內容即是程式碼，便於透過 Git diff 檢視變更，也利於 agent 直接編輯。 | | 中繼資料 | 包含 `SlideMeta`、theme、createdAt、design、notes、transition | 可直接在程式碼中寫入標題、主視覺主題、講者備註與轉場特效等設定。 | | 簡報資源 | 支援圖片、影片、字型等專屬或全域資源 | 素材直接收納在專案中，匯出時再由打包工具一併處理。 | | 開發輸出 | 提供瀏覽器預覽器、縮圖功能、熱更新（HMR）與簡報者介面 | 專為作者編輯、除錯迭代與現場投影播放所設計。 | | 靜態輸出結果 | 執行 `open-slide build` 所產生的靜態網頁檔案 | 適合直接部署至靜態網站代管平台，不需常駐應用程式伺服器。 | | HTML 匯出 | 單一獨立 HTML 檔案；若有附帶資源則會將 HTML 與資產打包在一起 | 方便分發，適合做為可離線開啟播放的簡報副本。 | | PDF 匯出 | 呼叫瀏覽器的列印流程（print-ready flow）轉存為 PDF | 適合輸出固定版面的靜態簡報，但仍需留意特殊字型與轉場效果是否跑版。 | | PPTX 匯出 | 專案原始碼中包含以圖片為基礎的 PPTX 匯出模組 | 主要做法是將每頁投影片渲染為圖片並封裝至 PPTX 檔案，不會轉出可編輯的文字框。目前公開的 README 仍以 HTML 與 PDF 作為主要匯出管道。 | 在這些格式中，PPTX 匯出的機制特別需要釐清。從原始碼的 `exportSlideAsImagePptx` 實作來看，該功能會將每頁投影片以 2 倍像素比例渲染為 PNG 圖片並封裝入簡報包。這種做法屬於「將視覺設計截圖後塞入 PPTX 容器」，並不會把 React 元件轉換為 PowerPoint 的原生文字框、向量圖形或可編輯物件。如果簡報的交付條件是客戶必須能在 PowerPoint 內編輯內文，目前 open-slide 的這套匯出機制可能無法滿足此需求。 ## 技術架構：兩個公開套件加上一個 agent-friendly workspace open-slide 採用 pnpm 與 Turbo 組成的 monorepo 架構，其核心運作可拆解為以下三個層次： ### 專案啟動層：`@open-slide/cli` 此套件版本為 `1.4.1`，執行環境要求 Node.js 版本為 `>=18`。它主要負責執行 `init` 初始化工作，將基礎投影片範本、設定檔、agent 專屬技能（skills）描述以及指引手冊複製到新的工作區目錄。此外，在建置 CLI 時，它會自動將產生的 `package.json` 中的 `@open-slide/core` 版本號替換為對應的 core 版本，確保專案範本中的預留字眼不會直接變成使用者安裝時的無效版號。 ### 核心運行層：`@open-slide/core` 此核心套件版本為 `1.17.1`，同樣限制 Node.js `>=18`。其內部主要包含： - React 簡報環境：建置了首頁入口、投影片檢視器、縮圖側欄、簡報者模式、DOM 檢查器與資源管理介面。 - 開發指令 `open-slide dev`：用以啟動開發伺服器，支援 `--port`、`--host` 與 `--open` 等常見參數。 - 編譯指令 `open-slide build`：用於導出正式環境的靜態網站，可藉由 `--out-dir` 指定輸出路徑。 - 預覽指令 `open-slide preview`：用來在本機預覽編譯完成的靜態成果。 - Vite 插件：自動掃描 `slides//index.{tsx,jsx,ts,js}` 檔案，利用虛擬模組（virtual modules）將投影片導出至執行環境，並支援在投影片檔案新增或刪除時觸發自動重載（reload）。 - 開發端 API：提供簡報檢查器、註解回寫、媒體檔案讀寫、資料夾管理及備註更新等後台 API。 套件依賴項涵蓋了 React、React DOM、Vite、Tailwind CSS、Base UI、dnd-kit、React Router、Babel parser、`html-to-image` 以及 `fflate`。從這些組成元件來看，它是一個具備視覺化編輯與雙向程式碼回寫能力的 React 專案環境，這與單純的 Markdown 轉網頁編譯器有顯著的差別。 ### 協作規則層：Skills 機制 存放於 `packages/core/skills/` 的定義檔是框架與 coding agent 溝通的權威依據。當執行 CLI 初始化時，這些定義會被搬移至 `.agents/skills/`，並同步在 `.claude/skills/` 中建立連結。這些規則檔案規範了： - 簡報結構的規劃守則。 - 1920 × 1080 畫布比例與字體縮放比例（type scale）。 - 素材管理、主題套用、動畫特效與過場特效的規範。 - 如何解析視覺化檢查器所產生的 comment 語法。 - 當使用者提及「這頁投影片」時，agent 如何透過讀取 `current.json` 定位當前的簡報 ID、頁碼與選取元素。 因此，open-slide 與 AI agent 的整合，核心在於檔案與流程的約定契約。框架本身並不提供特定需要串接 token 的雲端模型服務，開發者可依喜好選用不同的 agent 工具。只要該 agent 能解讀這些 skill 規範、具備專案檔案讀寫能力，並能獨立修改 React 程式碼，就能接入這套工作流。 ## 三種實際使用情境 ### 1. 技術分享與團隊內部簡報 如果想將簡報程式碼、系統架構與流程圖納入版本控制，這是最契合的情境： - 先透過 `/create-slide` 決定投影片大綱與總頁數。 - 每一頁均能以原生 React 實作圖表、互動流程圖、程式碼高亮區塊（syntax highlighter）與醒目的排版。 - 透過 `slide-authoring` 技能來約束畫布尺寸、字體大小與間距。 - 播放時利用簡報者模式搭配 speaker notes 順暢登台。 - 最終編譯為 static site，直接掛載在公司內部網站或轉為網址分享。 此情境的核心優勢在於簡報與專案原始碼同步存放在 Git 之中，不僅在調整簡報時能檢視 diff 紀錄，也能安心指派 agent 針對特定頁面進行微調。 ### 2. 產品提案與路線圖（Roadmap） 商業提案往往在簡報前夕面臨標題調整、更換產品截圖或修正業務數據的需求。在此情境下，可以先讓 agent 快速產生首版草稿，隨後在瀏覽器中點選要修改的元素，將修改指令寫入為程式碼中的 marker，最後調用 `/apply-comments` 進行一鍵批次修改。 這套工作流非常適合用在「視覺版面已大致定案，但細部文字仍需反覆琢磨」的場景。但需注意，若簡報需要多人在瀏覽器中即時同步編輯，由於 open-slide 的架構並不屬於雲端協作簡報平台，此時仍應透過 Git 分支、PR（Pull Request）等傳統軟體工程手段來協作開發。 ### 3. Agent 生成並需線上部署的簡報網頁 當簡報需要公開展示或託管於網路、不限於在本機播放時，open-slide 的 static build 機制可將簡報邏輯與靜態素材打包為獨立的靜態網頁專案： ```bash pnpm build pnpm preview ``` 隨後只需將編譯出的靜態檔案上傳至靜態主機即可。這種模式非常適合產品發表投影片、技術文件中的互動指南、線上課程教材或內部知識庫。需要提醒的是，即使在伺服器上部署成功，網頁中的外部字體、影片格式以及瀏覽器專屬 API 能否在各種裝置上完美運作，仍需在發表前進行實際的跨瀏覽器相容性測試（QA）。 ## 什麼時候不適合用？ ### 1. 交付目標為「可自由編輯的商務 PowerPoint 檔案」 open-slide 的主要渲染結果為 React 渲染出的網頁畫布。即使目前的原始碼中包含了基於圖片的 PPTX 匯出功能，其本質仍是將畫面擷圖打包為簡報包。如果你的主管或客戶要求拿到簡報後，必須能直接在 PowerPoint 裡敲鍵盤修改文字、調整表格內容或編輯向量圖表，請務必選擇原生簡報格式或其他工具。 ### 2. 習慣使用流式排版（Flow Layout）快速產出內容 1920 × 1080 的固定畫布雖然提供了像素級（pixel-level）的精密排版控制，但也意味著開發者仍要自行處理版面排版與尺寸控制。當內文字數超出預期、圖片寬高比例不合、或是因多國語言導致行寬拉長時，都需要自行撰寫 CSS 來防止文字溢出或跑版。這種設計高度有利於追求精緻視覺的簡報，但若你的目標只是快速堆砌文字清單（bullet points），這樣的自由度反而會帶來額外的切版負擔。 ### 3. 指望框架自主決定簡報內容與數據的正確性 儘管 `/create-slide` 技能能協助大綱生成，檢查器也能加速版面微調，但 open-slide 核心並不在於提供事實查核、品牌語氣審查或簡報結構合理性的評估。AI agent 自動生成的數據、名言引用、圖表內容與規格描述，在正式場合發表前，依然必須由人類進行嚴格的事實審查與校對。 ### 4. 需要完備的雲端協作平台功能 從官方的程式庫與說明文件來看，open-slide 的主力是本機開發環境、開發伺服器以及靜態網頁輸出路徑。目前的公開資料並未將其定位為一套包含使用者帳號、雲端多人共同編輯、細部權限管控、託管儲存空間或提供服務水準保證（SLA）的 SaaS 平台。此類多人協作需求，仍需開發團隊自行結合 Git 分支管理、自動化 CI/CD 以及第三方雲端代管服務來搭建。 ## 授權與版本注意事項 專案根目錄的 `LICENSE` 採用 MIT 開源協定，這意味著你可自由進行使用、修改、分發與商業應用，唯需在散布時保留版權聲明與授權條款。必須注意的是，此協議僅適用於 open-slide 框架本身的程式碼；簡報中所引用的圖片、客製字型、影片素材、企業品牌商標或外部第三方樣式，其版權與授權範圍仍需開發者自行確認並遵循。 目前官方的 `main` 分支目前仍在持續更新中，且 `@open-slide/core` 與 `@open-slide/cli` 有各自獨立的 npm 版本號。為了建立可重複部署（reproducible）的簡報專案建置流程，強烈建議在專案中鎖定特定的 CLI 與 core 套件版本，並確實提交 lockfile，避免過度依賴無特定版本限制的 `npx @open-slide/cli` 執行指令。 ## 結語：將簡報開發融入 React 的工程迭代中 open-slide 最值得關注的價值，在於將 agent 的程式碼生成優勢接到前端開發流程。它藉由設計明確的 React runtime，滿足簡報必備的畫布比例、頁面導覽、播放模式、線上檢查與匯出需求。 如果你已經習慣用 Git 控管前端專案、能適應 1920 × 1080 的固定比例畫布，且期望 agent 能直接在投影片原始碼上進行微調，那麼 open-slide 適合用來製作技術分享、產品提案、開發路線圖或互動教學簡報。最務實的做法是將其定位為「AI 協作開發 + React 簡報運行環境」的組合工具，若期望它完全替代傳統 PowerPoint 全功能辦公室套件，則可能與其實際功能定位有所出入。 ## 官方來源 - [open-slide repository](https://github.com/1weiho/open-slide) - [open-slide README](https://raw.githubusercontent.com/1weiho/open-slide/main/README.md) - [open-slide 官方文件](https://open-slide.dev/docs) - [`@open-slide/cli` README](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/cli/README.md) - [`@open-slide/core` README](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/core/README.md) - [`create-slide` skill](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/core/skills/create-slide/SKILL.md) - [`apply-comments` skill](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/core/skills/apply-comments/SKILL.md) - [`@open-slide/cli` init source](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/cli/src/init.ts) - [`@open-slide/core` package metadata](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/core/package.json) - [`@open-slide/cli` package metadata](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/cli/package.json) - [`export-html.ts`](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/core/src/app/lib/export-html.ts) - [`export-pdf.ts`](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/core/src/app/lib/export-pdf.ts) - [`export-pptx.ts`](https://raw.githubusercontent.com/1weiho/open-slide/main/packages/core/src/app/lib/export-pptx.ts) - [`LICENSE`](https://raw.githubusercontent.com/1weiho/open-slide/main/LICENSE)