跳到正文

Markdown 编辑器

Markdown Editor

边写边预览 Markdown,可导出渲染后的 HTML,支持 GFM 表格和任务列表。

一个 Markdown 编辑器,旁边是渲染结果,后面是对应的 HTML,还有标题大纲。解析器是本仓库自己实现的 CommonMark,在规范的 652 个示例测试集上通过率 99.8%。

🔒 完全在你的浏览器里运行markdownprevieweditorhtml

Markdown

预览

视图

关于这个项目

一个带实时预览的 Markdown 编辑器。加粗、斜体、代码 和链接。

开始使用

  1. 克隆仓库
  2. 运行安装程序
  3. 打开应用
项目 数量 金额
笔记本 2 2,400,000
显示器 3 900,000

引用是这样显示的。

const total = items.reduce((sum, item) => sum + item.price, 0);
  • [x] 任务列表能用
  • [ ] 没打勾的也一样

选项

文档

词

38

字符

315

链接

1

图片

0

代码块

1

表格

1

大纲

  • 关于这个项目 #section
  • 开始使用 #section-1

锚点做罗马字转写,不做百分号编码。转写的对象只有谚文,汉字不在其中会被丢掉,所以纯中文标题的锚点是 section、section-1……

这里用的解析器是本仓库自己实现的 CommonMark,和 DOCX 转换器用的是同一个,规范自带的 652 个例子通过率 99.8%。GFM 管道表格是加在它上面的扩展。

怎么用

  1. 写或粘贴 Markdown

    边输入边更新预览。顶部的 YAML front matter 会被识别并从预览中排除,而不是渲染成一条水平线。

  2. 需要输出时切换到 HTML

    同一份文档的 HTML 形式,可以直接复制进 CMS 或邮件模板。下载得到的是完整文件。

  3. 用大纲检查标题结构

    每个标题都带着它将获得的锚点。从 h2 跳到 h4 会立刻在这里显现,重复的锚点也一样。

常见问题

原始 HTML 为什么默认被丢弃?

CommonMark 说要原样通过,对你自己写的文档这是对的,对粘贴来的文档这是一个跨站脚本漏洞。开关带着警告放在那里,给你自己的文档用。

我的表格不渲染

管道表格是 GitHub 扩展,不属于 CommonMark。开关默认打开;如果关着,你看到的是严格的规范行为,管道符被渲染成文本。

锚点为什么是罗马字?

为了让指向韩文标题的链接贴进聊天窗口后还能用。百分号编码的锚点正确但不可读,有几种系统会在中途把它弄坏。转写只作用于韩文:中文标题没有罗马字形式,锚点会落到 section、section-1 这样的名字上。

可以从这些接进来

接下来

这些工具吃得下当前工具的产出,结果可以直接送过去。