xDocxDoc
AI
前端
后端
iOS
Android
Flutter
AI
前端
后端
iOS
Android
Flutter
    • markdown-it
    • API 文档

API 文档

安装

node.js

npm install markdown-it

浏览器 (CDN)

https://www.jsdelivr.com
https://cdnjs.com

使用示例

另见:https://github.com/markdown-it/markdown-it/blob/master/docs/development.md

基础用法

// node.js
// 对于 CJS 可以使用 require('markdown-it')
import markdownit from 'markdown-it'
const md = markdownit()  // 创建 markdown-it 实例
const result = md.render('# markdown-it rulezz!');  // 渲染 markdown 内容

// 浏览器中使用 UMD 构建(脚本加载后添加到 window 对象)
// 注意:名称中没有短横线 "markdownit"
const md = window.markdownit();  // 通过全局对象使用
const result = md.render('# markdown-it rulezz!');  // 渲染结果

单行渲染(无段落包裹)

import markdownit from 'markdown-it'
const md = markdownit()
// 渲染单行内联内容(不自动包裹段落标签)
const result = md.renderInline('__markdown-it__ rulezz!');

使用预设和选项初始化

(*) 预设定义了激活的规则和选项组合。可选值:"commonmark"、"zero" 或 "default"(默认)。详见 API 文档。

import markdownit from 'markdown-it'

// Commonmark 模式
const md = markdownit('commonmark')

// 默认模式
const md = markdownit()

// 启用所有功能
const md = markdownit({
  html: true,       // 允许源文件中的 HTML 标签
  linkify: true,    // 自动转换类似 URL 的文本为链接
  typographer: true // 启用排版美化功能
})

// 完整选项列表(默认值)
const md = markdownit({
  html: false,          // 是否允许源文件中的 HTML 标签
  xhtmlOut: false,      // 是否使用 '/' 闭合单标签(如 <br />)
  breaks: false,        // 是否将段落中的换行符转换为 <br>
  langPrefix: 'language-', // 围栏代码块 CSS 类前缀
  linkify: false,       // 是否自动转换 URL 文本为链接
  typographer: false,   // 是否启用排版替换和引号美化
  quotes: '“”‘’',       // 启用排版时的双引号/单引号替换对
  // 语法高亮函数。返回转义后的 HTML 或空字符串
  highlight: function (str, lang) {
    if (lang && hljs.getLanguage(lang)) {
      try {
        return hljs.highlight(str, { language: lang }).value;
      } catch (__) {}
    }
    return ''; // 使用外部默认转义
  }
});

插件加载

import markdownit from 'markdown-it'

// 链式调用 use() 方法加载插件
const md = markdownit()
  .use(plugin1)          // 加载插件1
  .use(plugin2, opts, ...) // 加载插件2并传参
  .use(plugin3);         // 加载插件3

语法高亮

通过 highlight 选项为围栏代码块启用语法高亮:

import markdownit from 'markdown-it'
import hljs from 'highlight.js' // 引入 highlight.js

// 实际使用的高亮函数
const md = markdownit({
  highlight: function (str, lang) {
    if (lang && hljs.getLanguage(lang)) {
      try {
        // 使用 highlight.js 进行高亮处理
        return hljs.highlight(str, { language: lang }).value;
      } catch (__) {}
    }
    return ''; // 使用外部默认转义
  }
});

自定义高亮包装器

import markdownit from 'markdown-it'
import hljs from 'highlight.js'

// 自定义包装器(可控制 <pre>/<code> 的类名)
const md = markdownit({
  highlight: function (str, lang) {
    if (lang && hljs.getLanguage(lang)) {
      try {
        // 返回完整包装的 HTML 结构
        return '<pre><code class="hljs">' +
               hljs.highlight(str, { language: lang, ignoreIllegals: true }).value +
               '</code></pre>';
      } catch (__) {}
    }
    // 默认转义处理
    return '<pre><code class="hljs">' + md.utils.escapeHtml(str) + '</code></pre>';
  }
});

链接处理

linkify: true 使用 https://github.com/markdown-it/linkify-it。通过 md.linkify 配置:

md.linkify.set({ fuzzyEmail: false });  // 禁用将电子邮件转换为链接

语法扩展

默认启用的扩展:

  • 表格(GFM)
  • 删除线(GFM)

通过插件支持:

  • 下标
  • 上标
  • 脚注
  • 定义列表
  • 缩写
  • 表情符号
  • 自定义容器
  • ...等

规则管理

默认启用所有规则,可通过配置限制。插件加载时会自动启用其规则。

import markdownit from 'markdown-it'

// 通过柯里化启用/禁用规则
const md = markdownit()
  .disable(['link', 'image'])  // 禁用链接和图片规则
  .enable(['link'])            // 重新启用链接规则
  .enable('image');            // 启用图片规则

// 启用所有功能
const md = markdownit({
  html: true,
  linkify: true,
  typographer: true,
});

API 文档

Core(核心)

描述

顶级规则执行器。整合块级/内联解析器并进行中间转换。

构造函数

new Core()

类方法

Core.process(state) - 执行核心链规则

实例属性

Core#ruler - Ruler 实例。保存核心规则配置。


MarkdownIt(主类)

描述

主解析器/渲染器类。

构造函数

new MarkdownIt([presetName][, options])

类方法

方法描述
.configure(presets)批量加载配置(内部方法)
.disable(list, ignoreInvalid)禁用指定规则
.enable(list, ignoreInvalid)启用指定规则
.parse(src, env)解析输入字符串并返回块令牌列表
.parseInline(src, env)仅解析内联内容
.render(src[, env])将 markdown 渲染为 HTML
.renderInline(src[, env])渲染单行内容(无 <p> 包裹)
.set(options)动态设置解析器选项
.use(plugin, params)加载插件

实例属性

属性描述
.block块解析器实例
.core核心链执行器
.helpers链接组件解析函数
.inline内联解析器实例
.linkifylinkify-it 实例
.renderer渲染器实例
.utils工具函数集合

ParserBlock(块解析器)

描述

块级令牌化器。

构造函数

new ParserBlock()

类方法

ParserBlock.parse(str, md, env, outTokens) - 处理输入字符串并生成块令牌

实例属性

ParserBlock#ruler - Ruler 实例(块规则配置)


ParserInline(内联解析器)

描述

段落内容令牌化器。

构造函数

new ParserInline()

类方法

ParserInline.parse(str, md, env, outTokens) - 处理输入并生成内联令牌

实例属性

属性描述
.ruler内联规则配置
.ruler2后处理规则配置

Renderer(渲染器)

描述

将令牌流生成为 HTML。每个实例拥有独立的规则副本。

构造函数

new Renderer()

类方法

方法描述
.render(tokens, options, env)主渲染方法
.renderAttrs(token)渲染令牌属性
.renderInline(tokens, options, env)渲染内联令牌
.renderInlineAsText(tokens, options, env)渲染纯文本(内部使用)
.renderToken(tokens, idx, options)默认令牌渲染器

实例属性

Renderer#rules - 包含令牌渲染规则的对象


Ruler(规则管理器)

描述

管理函数规则序列的辅助类。

构造函数

new Ruler()

类方法

方法描述
.after(afterName, ruleName, fn[, options])在指定规则后添加新规则
.at(name, fn[, options])按名称替换规则
.before(beforeName, ruleName, fn[, options])在指定规则前添加新规则
.disable(list[, ignoreInvalid])禁用规则列表
.enable(list[, ignoreInvalid])启用规则列表
.enableOnly(list[, ignoreInvalid])仅启用指定规则
.getRules(chainName)获取活动规则函数列表
.push(ruleName, fn[, options])向规则链末尾添加规则

Token(令牌类)

描述

表示解析后的 markdown 元素。

构造函数

new Token(type, tag, nesting)

类方法

方法描述
.attrGet(name)获取属性值
.attrIndex(name)查找属性索引
.attrJoin(name, value)通过空格连接属性值
.attrPush(attrData)添加新属性
.attrSet(name, value)设置属性值

实例属性

属性描述
.attrsHTML 属性数组
.block是否为块级元素
.children子节点数组
.content内容字符串
.hidden是否隐藏渲染
.info附加信息(如围栏代码块语言)
.level嵌套层级
.map源码映射信息
.markup标记字符(如 *, _)
.meta插件存储区
.nesting开/关标签标志(1=开, 0=自闭合, -1=关)
.tagHTML 标签名
.type令牌类型(如 "paragraph_open")

总结

本文档全面介绍了 markdown-it 解析器的功能和使用方法,主要内容包括:

  1. 安装方式:支持 Node.js 和浏览器(通过 CDN)环境安装
  2. 核心功能:
    • 基础 markdown 渲染
    • 单行内联渲染
    • 预设配置(commonmark/default/zero)
    • 插件系统
    • 语法高亮集成
    • 链接自动化处理
  3. API 架构:
    • Core:规则执行器
    • MarkdownIt:主解析/渲染类
    • ParserBlock/ParserInline:块级/内联解析器
    • Renderer:可扩展的渲染系统
    • Ruler:规则管理系统
    • Token:文档元素表示
  4. 高级特性:
    • 规则动态管理(启用/禁用)
    • 语法扩展机制(表格、删除线等)
    • 自定义渲染规则
    • 链接验证与处理

markdown-it 通过模块化设计提供了高度可扩展的 markdown 解析解决方案,支持通过插件系统增强功能,同时保持核心轻量和高效。开发人员可以根据需求灵活配置规则,定制渲染输出,满足多样化的文档处理需求。

最后更新: 2025/8/26 10:07
Prev
markdown-it