streamdown
✓Vercel 的 Streamdown 庫的專家指南 - AI 應用程序的流優化的 React-Markdown 替代品。 在以下情況下使用:(1) 從 useChat/streamText 渲染 AI 生成的 markdown, (2) 使用流式響應構建聊天 UI, (3) 從react-markdown遷移到流友好渲染, (4) 配置代碼塊 (Shiki)、數學 (KaTeX)、圖表 (Mermaid)、 (5)處理AI Streaming期間不完整的Markdown(修正預處理器), (6) 使用 Tailwind/CSS 變量自定義 Markdown 樣式, (7) 通過 rehype-harden(鏈接/圖像協議)保護 AI 輸出。 觸發器:Streamdown、流式 Markdown、AI 聊天 Markdown、React-Markdown 替換、 AI元素響應、不完整降價、推薦、Shiki主題、美人魚圖、 KaTeX 數學、rehype-harden、isAnimating、markdown 流。
SKILL.md
Streamdown is a drop-in react-markdown replacement designed for AI-powered streaming applications. It handles incomplete markdown syntax gracefully using the remend preprocessor.
| children | string | required | Markdown content to render | | isAnimating | boolean | false | Disables interactive controls during streaming | | mode | "streaming" \| "static" | "streaming" | Rendering mode | | shikiTheme | [BundledTheme, BundledTheme] | ['github-light', 'github-dark'] | Light/dark syntax themes |
| controls | ControlsConfig \| boolean | true | Button visibility for code/table/mermaid | | mermaid | MermaidOptions | {} | Diagram configuration | | components | object | {} | Custom element overrides | | className | string | "" | Container CSS class | | remarkPlugins | Pluggable[] | GFM, math, CJK | Markdown preprocessing |
可引用資訊
為搜尋與 AI 引用準備的穩定欄位與指令。
- 安裝指令
npx skills add https://github.com/bjornmelin/dev-skills --skill streamdown- 分類
- </>開發工具
- 認證
- ✓
- 收錄時間
- 2026-02-01
- 更新時間
- 2026-02-18
快速解答
什麼是 streamdown?
Vercel 的 Streamdown 庫的專家指南 - AI 應用程序的流優化的 React-Markdown 替代品。 在以下情況下使用:(1) 從 useChat/streamText 渲染 AI 生成的 markdown, (2) 使用流式響應構建聊天 UI, (3) 從react-markdown遷移到流友好渲染, (4) 配置代碼塊 (Shiki)、數學 (KaTeX)、圖表 (Mermaid)、 (5)處理AI Streaming期間不完整的Markdown(修正預處理器), (6) 使用 Tailwind/CSS 變量自定義 Markdown 樣式, (7) 通過 rehype-harden(鏈接/圖像協議)保護 AI 輸出。 觸發器:Streamdown、流式 Markdown、AI 聊天 Markdown、React-Markdown 替換、 AI元素響應、不完整降價、推薦、Shiki主題、美人魚圖、 KaTeX 數學、rehype-harden、isAnimating、markdown 流。 來源:bjornmelin/dev-skills。
如何安裝 streamdown?
開啟你的終端機或命令列工具(如 Terminal、iTerm、Windows Terminal 等) 複製並執行以下指令:npx skills add https://github.com/bjornmelin/dev-skills --skill streamdown 安裝完成後,技能將自動設定到你的 AI 程式設計環境中,可以在 Claude Code 或 Cursor 中使用
這個 Skill 的原始碼在哪?
https://github.com/bjornmelin/dev-skills
詳情
- 分類
- </>開發工具
- 來源
- skills.sh
- 收錄時間
- 2026-02-01