recipe/docs/md-enhance/src/zh

home	title	icon	bgImage	bgImageDark	bgImageStyle	heroText	tagline	actions	highlights	footer	copyright
true	主頁	home	https://theme-hope-assets.vuejs.press/bg/6-light.svg	https://theme-hope-assets.vuejs.press/bg/6-dark.svg	background-attachment fixed	vuepress-plugin-md-enhance	為 VuePress2 提供更多 Markdown 增强功能	text icon link type 指引 lightbulb ./guide/ primary text icon link 配置 tools ./config.html	header image bgImage bgImageDark highlights 開箱即用 /assets/image/box.svg https://theme-hope-assets.vuejs.press/bg/3-light.svg https://theme-hope-assets.vuejs.press/bg/3-dark.svg title icon details link GFM 支持 clipboard-check 支持 GitHub 風格 Markdown ./guide/others.html#gfm header image bgImage bgImageDark highlights 新語法 /assets/image/module.svg https://theme-hope-assets.vuejs.press/bg/2-light.svg https://theme-hope-assets.vuejs.press/bg/2-dark.svg title icon details link 擴展圖片語法 image 指定圖片大小與顏色模式，並將它們轉化為插圖 ./guide/grammar/image.html title icon details link 上下標支持 superscript 你的 Markdown 現在將支持上下標 ./guide/grammar/sup-sub.html title icon details link 任務列表 square-check 在 Markdown 中使用任務列表 ./guide/grammar/tasklist.html title icon details link TeX square-root-variable Markdown 現在也可以支持 TeX 語法以顯示公式 ./guide/grammar/tex.html header image bgImage bgImageDark highlights 聚焦内容 /assets/image/edit.svg https://theme-hope-assets.vuejs.press/bg/10-light.svg https://theme-hope-assets.vuejs.press/bg/10-dark.svg title icon details link 註解 quote-left 你的 Markdown 現在將支持註解 ./guide/content/footnote.html title icon details link 導入文件 fab fa-markdown 將你的文檔分段，並在 Markdown 中導入 ./guide/content/include.html title icon details link 投影片 person-chalkboard 通過 Reveal.js 在 Markdown 中插入投影片 ./guide/content/revealjs/ title icon details link 選項卡 table-columns 使用選項卡對相似内容進行分組 ./guide/content/tabs.html title icon details link 元件 puzzle-piece 在 Markdown 中快速插入元件 ./guide/content/component.html header image bgImage bgImageDark bgImageStyle highlights 内容樣式化 /assets/image/marker.svg https://theme-hope-assets.vuejs.press/bg/1-light.svg https://theme-hope-assets.vuejs.press/bg/1-dark.svg background-repeat background-size repeat initial title icon details link 提示容器 box-archive 用樣式裝飾 Markdown 内容 ./guide/stylize/hint.html title icon details link GFM 警告 bell GFM 風格的警告容器 ./guide/stylize/alert.html title icon details link 自定義對齊 align-center 讓你在 Markdown 中對段落進行對齊 ./guide/stylize/align.html title icon details link 屬性 code 讓你為 Markdown 元素增加屬性 ./guide/stylize/attrs.html title icon details link 標記 highlighter 標記並高亮内容 ./guide/stylize/mark.html title icon details link 遮蔽 eraser 增加遮蔽標記支持 ./guide/stylize/spoiler.html title icon details link 樣式化字符 wand-magic-sparkles 以你想要的方式樣式化字符 ./guide/stylize/stylize.html header image bgImage bgImageDark highlights 嵌入圖表 /assets/image/chart.svg https://theme-hope-assets.vuejs.press/bg/5-light.svg https://theme-hope-assets.vuejs.press/bg/5-dark.svg title icon details link Chart.js chart-simple 在 Markdown 中展示 Chart.js 圖表 ./guide/chart/chartjs.html title icon details link ECharts bar-chart 在 Markdown 中展示 ECharts 圖表 ./guide/chart/echarts.html title icon details link 流程圖 route 在 Markdown 中增加流程圖 ./guide/chart/flowchart.html title icon details link Markmap fab fa-markdown 從 Markdown 生成思维導圖 ./guide/chart/markmap.html title icon details link Mermaid chart-pie 在 Markdown 中增加 Mermaid 圖例 ./guide/chart/mermaid.html title icon details link Plantuml diagram-project 在 Markdown 中增加 Plantuml ./guide/chart/plantuml.html header image bgImage bgImageDark highlights 展示你的程式碼和工作 /assets/image/code.svg https://theme-hope-assets.vuejs.press/bg/4-light.svg https://theme-hope-assets.vuejs.press/bg/4-dark.svg title icon details link 程式碼選項卡 code 使用選項卡對相似程式碼進行分組 ./guide/code/code-tabs.html title icon details link 程式碼案例 laptop-code 你可以很方便的插入程式碼案例 ./guide/code/demo/ title icon details link 互動範例 code 你可以在 Markdown 中增加互動範例 ./guide/code/playground.html title icon details link Kotlin 互動範例 fab fa-kickstarter 響應式的 Kotlin Playground ./guide/code/kotlin-playground.html title icon details link Vue 互動範例 fab fa-vuejs 在互動範例中展示 Vue 元件 ./guide/code/vue-playground.html title icon details link Sandpack 互動範例 code Sandpack 驱動的實時的編碼環境 ./guide/code/sandpack.html	使用 <a href="https://theme-hope.vuejs.press/zh/" target="_blank">VuePress Theme Hope</a> 主題 | MIT 協議, 版權所有 © 2019-present Mr.Hope	false

安裝

::: code-tabs#shell

@tab pnpm

pnpm add -D vuepress-plugin-md-enhance

@tab yarn

yarn add -D vuepress-plugin-md-enhance

@tab npm

npm i -D vuepress-plugin-md-enhance

:::

使用

::: code-tabs#language

@tab TS

import { mdEnhancePlugin } from "vuepress-plugin-md-enhance";

export default {
  plugins: [
    mdEnhancePlugin({
      // 你的選項
    }),
  ],
};

@tab JS

import { mdEnhancePlugin } from "vuepress-plugin-md-enhance";

export default {
  plugins: [
    mdEnhancePlugin({
      // 你的選項
    }),
  ],
};

:::

從 V1 遷移

詳見 遷移指引。