Skip to content

建立 2026-09-15 更新 2026-09-15

Markdown 擴充

一般 Markdown 能寫的標題、清單、連結、圖片,VitePress 都支援。文件站真正常用的是下面這幾項擴充。完整語法以官方〈Markdown 擴充〉為準。

Frontmatter

每個 .md 頂端可用 YAML 覆寫該頁標題、描述,或指定版型:

---
title: 快速開始
description: 安裝 VitePress 並啟動開發伺服器
---

首頁還會用 layout: home 搭配 herofeatures,見 首頁版型

內部連結

站內連結請省略副檔名,讓 VitePress 依設定產生最終 URL:

[安裝](../start/install)
[安裝](../start/install.md)
[安裝](../start/install.html)

三種寫法都能導到同一頁,建議固定用無副檔名或 .md。外部連結會自動 target="_blank"

提示框(自訂容器)

::: info
補充說明。
:::

::: tip
建議這樣做。
:::

::: warning
可能踩坑。
:::

::: danger
繼續操作會造成問題。
:::

::: details
點開才看到的內容。
:::

標題可自訂:tip 安裝提示。也支援 GitHub 風格的 > [!NOTE]> [!WARNING]

程式碼區塊

語言名稱接在圍欄後面就會用 Shiki 上色。文件裡最常用的還有:

寫法 用途
```js{4} 高亮第 4 行
```js{1,4,6-8} 多行、區間混用
// [!code ++] / [!code --] 顯示新增/刪除
:line-numbers 單一塊開啟行號
<<< @/snippets/foo.js 從專案檔案匯入片段

多個套件管理員的指令可用 code-group 做成可切換分頁,避免同一段指令複製三次。

目錄與表格

頁面中寫 [[toc]] 可插入該頁標題目錄。GitHub 風格表格可直接使用。標題可加 {#custom-id} 自訂錨點,方便穩定連結。

語法屬於 VitePress 頁面

上面的 tip[[toc]]code-groupVitePress 文件頁 的寫法。本教學站本身用 Zensical,提示框寫成 !!! tip。複製範例時請放到 VitePress 專案的 .md,不要直接貼進本站原始檔預期相同效果。