recipe/packages/create/template/blog/zh/demo/markdown.md
2024-08-18 19:16:25 +08:00

6.7 KiB
Raw Permalink Blame History

title icon order category tag
Markdown 展示 fab fa-markdown 2
使用指引
Markdown

VuePress 主要從 Markdown 文件生成頁面。因此,你可以使用它輕鬆生成文檔或網誌網站。

你應該創建和編寫 Markdown 文件,以便 VuePress 可以根據文件結構將它們轉換為不同的頁面。

Markdown 介紹

如果你是一個新手,還不會編寫 Markdown請先閱讀 Markdown 介紹Markdown 範例

Markdown 配置

VuePress 通過 Frontmatter 為每個 Markdown 頁面引入配置。

::: important Frontmatter

Frontmatter 是 VuePress 中很重要的一個概念,請閱讀 Frontmatter 介紹 了解詳情。

:::

Markdown 擴展

VuePress 會使用 markdown-it 來解析 Markdown 内容,因此可以借助於 markdown-it 外掛程式來實現 語法擴展

VuePress 擴展

為了豐富文檔寫作VuePress 對 Markdown 語法進行了擴展。

關於這些擴展,請閱讀 VuePress 中的 Markdown 擴展

主題擴展

通過 vuepress-plugin-md-enhance,主題擴展了更多 Markdown 語法,提供更加豐富的寫作功能。

提示容器

::: v-pre

安全的在 Markdown 中使用 {{ variable }}。

:::

::: info 自定義標題

資訊容器,包含 程式碼連結

const a = 1;

:::

::: tip 自定義標題

提示容器

:::

::: warning 自定義標題

警告容器

:::

::: caution 自定義標題

危险容器

:::

::: details 自定義標題

詳情容器

:::

程式碼區塊

::: code-tabs

@tab pnpm

pnpm add -D vuepress-theme-hope

@tab yarn

yarn add -D vuepress-theme-hope

@tab:active npm

npm i -D vuepress-theme-hope

:::

上下標

19^th^ H~2~O

自定義對齊

::: center

我是居中的

:::

::: right

我在右對齊

:::

Attrs

一個擁有 ID 的 單詞{#word}。

註解

此文字有註解1.

標記

你可以標記 ==重要的内容== 。

任務列表

  • 計划 1
  • 計划 2

查看詳情

圖片增强

支持為圖片設置顏色模式和大小

元件

title: Mr.Hope
desc: Where there is light, there is hope
logo: https://mister-hope.com/logo.svg
link: https://mister-hope.com
background: rgba(253, 230, 138, 0.15)

導入文件

樣式化

向 Mr.Hope 捐贈一杯咖啡。 Recommended

Tex 語法


\frac {\partial^r} {\partial \omega^r} \left(\frac {y^{\omega}} {\omega}\right)
= \left(\frac {y^{\omega}} {\omega}\right) \left\{(\log y)^r + \sum_{i=1}^r \frac {(-1)^i r \cdots (r-i+1) (\log y)^{r-i}} {\omega^i} \right\}

圖表