Communitygithub.com

vercel/streamdown

实现、配置和自定义 Streamdown —— 一个专为流式输出优化的 React Markdown 渲染器,支持语法高亮、Mermaid 图、数学公式渲染以及中日韩(CJK)文本支持。

streamdown 是什么?

vercel/streamdown 是一个面向流式输出场景的 React Markdown 渲染器,经过专门优化以支持 AI 聊天等场景下的增量渲染。它集成了语法高亮(Shiki)、Mermaid 图、数学公式(如 KaTeX)和 CJK 文本处理等插件,开箱即用。该工具非常适合与 Vercel AI SDK 等 AI 流式框架配合使用,能够实时解析并渲染流式 Markdown 内容。同时,开发者可以灵活配置安全性(如链接安全、自定义 HTML 标签)、主题样式、静态模式或自定义组件,并轻松集成到 Tailwind 等样式体系中。此外,它还提供了 caret 符号处理、调试支持等高级功能,帮助开发者高效地构建动态、安全的流式内容展示界面。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/vercel/streamdown/tree/main/skills/streamdown

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

streamdown 是做什么的?

实现、配置和自定义 Streamdown —— 一个专为流式输出优化的 React Markdown 渲染器,支持语法高亮、Mermaid 图、数学公式渲染以及中日韩(CJK)文本支持。在以下场景中使用:安装或设置 Streamdown;配置插件(代码、mermaid、数学、cjk);样式化或主题化 Streamdown 输出;集成 AI 聊天/流式输出;配置安全性、链接安全或自定义 HTML 标签;使用 carets、静态模式或自定义组件;排查 Tailwind、Shiki 或 Vite 问题。触发条件包括:(1) 安装或设置 Streamdown;(2) 配置插件(代码、mermaid、数学、cjk);(3) 样式化或主题化 Streamdown 输出;(4) 集成 AI 聊天/流式输出;(5) 配置安全性、链接安全或自定义 HTML 标签;(6) 使用 carets、静态模式或自定义组件;(7) 排查 Tailwind、Shiki 或 Vite 问题。

相关技能