comark

让 AI 流式 Markdown 直接渲染成多框架交互组件

开源 freemium 开发框架
访问官网 ↗ GitHub ↗ 文档 ↗
GitHub 星标 ★ 1062
维护状态 活跃
是否开源 是
定价模式 freemium

项目预览

项目数据

分类开发框架
开发团队comarkdown
所属国家
官网地址https://comark.dev
定价模式freemium
价格说明开源免费,官网提供在线体验;付费方案待确认
访问状态
是否开源是
开源协议MIT
主要语言TypeScript
技术栈/模型ai,angular,ansi,commonmark,generative-ui,gfm,intelligent-ui,llm,markdown,markdown-parser,markdown-renderer,mdc,nuxt,react,streaming,streaming-markdown,svelte,vue
GitHub 星标★ 1062
30天Star增速
HF 下载量
上线时间2026-01-22 00:00:00
代码更新—
仓库体积—
本站数据更新—
维护状态活跃
中文支持
访问方式
移动端支持
综合评分
收录时间2026-10-19
浏览次数0

项目介绍

Comark 是一个开源 Markdown 解析与渲染框架,核心特色是把 Markdown 扩展成可带组件、属性和插件的结构化内容,从而让 AI 流式输出直接渲染成交互式 UI。它解决的是大模型返回的 Markdown 只能当纯文本展示、难以嵌入业务组件的问题:解析器识别自定义语法后,可映射到 React、Vue、Svelte、Angular、HTML 或终端 ANSI 输出,并支持边生成边渲染的流式模式。项目用 TypeScript 编写,兼容 CommonMark/GFM 基础语法,同时提供插件机制扩展语法和渲染行为,适合做 AI 对话、生成式 UI、文档预览等场景。对需要在多前端框架间复用同一套 Markdown 渲染逻辑的团队,它提供统一抽象,减少为每个框架重复实现解析与组件映射的成本。

Star 增长趋势

本站每日记录该项目 GitHub 星标变化,观测越久曲线越完整

正在加载星标数据…

技术标签

使用教程

—

难度:入门 约 10 分钟 部署方式:库/依赖 3 步

环境要求

  • Node.js 运行环境(需能用 npm 安装包)
  • npm 包管理器
  • 项目中使用 TypeScript 或 JavaScript(示例为 TypeScript/ESM 写法)

安装与启动步骤

  1. 1安装 comark

    在项目根目录安装 comark 依赖,作为解析库引入使用,无需单独启动服务。

    npm install comark
  2. 2调用解析函数

    从 comark 导入 parseMarkdown,传入 Markdown 字符串,得到紧凑、可序列化的文档树。

    import { parseMarkdown } from 'comark'
    
    const tree = await parseMarkdown('# Hello **World**')
    console.log(tree)
  3. 3选择并接入渲染器

    解析结果需交给渲染器输出,README 仅列出 React/Vue/Svelte/Angular/HTML/终端 ANSI,具体包名见官网文档。

如何确认成功

运行代码后打印出含 nodes、frontmatter、meta 的对象,且 h1 与 strong 节点结构正确即表示解析成功。

常见问题

Q:解析结果是什么格式?

A:是一个紧凑、可序列化的 Markdown 文档对象,包含 nodes、frontmatter 和 meta,可传给不同渲染器复用。

Q:支持哪些 Markdown 语法?

A:支持 CommonMark 与 GFM,另有少量差异;同时支持 frontmatter 和原生元素上的 {.class} 属性。

Q:AI 流式输出会渲染错乱吗?

A:不会,Comark 内置流式处理,会自动闭合未结束的语法,如 **bold、未闭合代码块和半开组件。

Q:能渲染成哪些目标?

A:同一份文档可渲染为 HTML、终端 ANSI,以及 Vue、React、Svelte、Angular 组件。

Q:需要构建步骤吗?

A:不需要,parseMarkdown 是运行时纯函数,数据库、CMS 或 LLM 内容保存后即可即时解析。

注意事项

  • README 未给出各渲染器的具体安装包名与用法,接入前请查阅官网 https://comark.dev 文档。
  • 自定义组件语法为 ::alert{type="warning"} ... ::,属于可选扩展语法,不影响普通 Markdown。
  • README 未说明最低 Node.js 版本,建议使用较新的 LTS 版本以避免 ESM/顶层 await 兼容问题。

核心亮点

  • 解析结果可映射为组件和属性,支持在 Markdown 中嵌入业务 UI,而非只输出静态 HTML
  • 一套解析逻辑覆盖 React、Vue、Svelte、Angular、HTML 和终端,跨框架复用成本低
  • 原生支持流式渲染,适合 LLM 逐 token 输出场景,可边生成边展示

不足之处

  • 项目仍处早期,API 和插件规范可能随版本调整,生产接入需关注兼容性
  • 自定义组件语法依赖各框架适配层,复杂交互组件的跨框架一致性需自行验证

适用场景

  • AI 聊天应用中把模型返回的 Markdown 实时渲染成带按钮、卡片等组件的消息流
  • 低代码/生成式 UI 平台根据 LLM 输出动态拼装前端界面
  • 多框架产品线统一 Markdown 渲染与组件映射,减少重复开发

替代项目

markdown-it、remark、MDX

上一篇:pydantic-ai-harness

下一篇:没有了!

同类项目推荐

dsh-our-free-model 开源

装个插件就能免密钥白嫖前沿大模型,不限量

在 dsh 里装上这个插件即可,无需登录、注册或填 API Key,就能使用包括 DeepSeek V4.1 Fl···

★ 23542 2026-10-04
ComfyUI-sol-attn 开源

在 ComfyUI 中让视频生成注意力更快更省显存

NVIDIA Sol-Attn for ComfyUI / Triton kernel on SM89 - SM121, with zero-copy MiniMax ···

★ 155 2026-08-09
langchain 开源

组装 AI 应用的乐高积木,从想法到上线不换工具

The agent engineering platform.

★ 148017 2026-08-09
transformers 开源

全球最大的模型仓库全家桶,想用的模型一把抓

Transformers: the model-definition framework for state-of-the-art machine learning m···

★ 167809 2026-08-09