VuePress 生态系统VuePress 生态系统
  • 主题指南
  • 默认主题
  • Hope 主题
  • Plume 主题
  • Reco 主题
  • 功能插件
  • Markdown 插件
  • 搜索插件
  • 博客插件
  • 渐进式应用插件
  • 统计分析插件
  • 搜索引擎优化插件
  • 开发插件
  • 工具插件
  • AI 插件
  • @vuepress/helper
  • English
  • 简体中文
GitHub
  • 主题指南
  • 默认主题
  • Hope 主题
  • Plume 主题
  • Reco 主题
  • 功能插件
  • Markdown 插件
  • 搜索插件
  • 博客插件
  • 渐进式应用插件
  • 统计分析插件
  • 搜索引擎优化插件
  • 开发插件
  • 工具插件
  • AI 插件
  • @vuepress/helper
  • English
  • 简体中文
GitHub
  • append-date
  • markdown-chart
    • markdown-chart
    • Chart.js
    • ECharts
    • Flowchart
    • Markmap
    • Mermaid
    • PlantUML
  • markdown-container
  • markdown-ext
  • markdown-image
  • markdown-include
  • markdown-hint
  • markdown-math
  • markdown-preview
  • markdown-stylize
  • markdown-tab
  • links-check
  • prismjs
  • revealjs
    • revealjs
    • 幻灯片演示
    • 幻灯片主题
  • shiki

Markmap

为你的 VuePress 站点中的 Markdown 文件添加 Markmap 支持。

安装

在你的项目中安装 markmap-lib、markmap-toolbar 和 markmap-view:

pnpm
pnpm add -D markmap-lib markmap-toolbar markmap-view
yarn
yarn add -D markmap-lib markmap-toolbar markmap-view
npm
npm i -D markmap-lib markmap-toolbar markmap-view

然后通过以下方式启用:

.vuepress/config.ts
import { markdownChartPlugin } from '@vuepress/plugin-markdown-chart'

export default {
  plugins: [
    markdownChartPlugin({
      // 启用 Markmap
      markmap: true,
    }),
  ],
}

语法

```markmap
<!-- 在这里放置内容 -->
```

支持通过 Frontmatter 语法进行配置。

案例

::: preview

:::

在 GitHub 上编辑此页
上次更新: 2025/6/7 08:43
贡献者: Mister-Hope
上一页
Flowchart
下一页
Mermaid