# VS Code Markdown 預覽教學：快捷鍵、並排預覽與疑難排解

> 在 VS Code 開啟 Markdown 預覽的方法，包括 Windows、macOS 快捷鍵、並排預覽、命令選擇區，以及預覽無法顯示時的解法。

## 快速答案

在 VS Code 開啟 `.md` 檔案後，按 `Cmd+Shift+V`（Windows、Linux 是 `Ctrl+Shift+V`），即可在新分頁開啟 Markdown 預覽。若要在編輯器旁邊並排預覽，依序按 `Cmd+K`、`V`（Windows、Linux 是 `Ctrl+K V`）。

| 功能 | macOS | Windows / Linux |
|---|---|---|
| 開啟／切換預覽 | `Cmd+Shift+V` | `Ctrl+Shift+V` |
| 在側邊開啟預覽 | `Cmd+K V` | `Ctrl+K V` |
| 開啟命令選擇區 | `Cmd+Shift+P` | `Ctrl+Shift+P` |

## 在新分頁開啟預覽

先確認目前開啟的是 `.md` 檔案，再使用預覽快捷鍵。VS Code 會顯示標題、清單、表格、連結、圖片和程式碼區塊的呈現結果。

如果忘記快捷鍵，可以打開命令選擇區並執行：

```text
Markdown: Open Preview
```

## 並排預覽

並排模式適合一邊編輯、一邊檢查結果。`Cmd+K V` 或 `Ctrl+K V` 是連續按鍵：先按第一組，再按 `V`，不需要同時按住全部按鍵。

也可以從命令選擇區執行：

```text
Markdown: Open Preview to the Side
```

預覽會隨著檔案更新，長文件通常也會同步捲動到相近位置。

## 不用裝擴充功能

VS Code 已內建 Markdown 預覽。只要查看標題、清單、表格、圖片和程式碼區塊，不需要安裝擴充功能。

以下需求才可能需要額外擴充功能：

- 匯出 PDF。
- 顯示特定 Mermaid 圖表或數學公式。
- 自動建立目錄。
- 增加輸入快捷鍵或格式檢查。

## Markdown 預覽無法顯示怎麼辦

依序檢查：

1. 檔名是否以 `.md` 結尾。
2. VS Code 右下角的語言模式是否為 `Markdown`。
3. 命令選擇區能否找到 `Markdown: Open Preview`。
4. 快捷鍵是否被其他擴充功能或系統快捷鍵占用。
5. 工作區是否停用了內建的 Markdown 語言功能。

如果快捷鍵無效，先從命令選擇區開啟預覽。命令可以執行、快捷鍵卻無效時，通常是按鍵衝突。

## 表格、圖片或圖表沒有正確顯示

- 表格第二列需要有 `| --- | --- |` 之類的分隔列。
- 相對圖片路徑是以目前 `.md` 檔案的位置為基準。
- 程式碼圍欄開頭和結尾都需要三個反引號。
- Mermaid 和數學公式是否顯示，取決於 VS Code 版本與擴充功能。
- 部分 HTML 會因安全設定而停用。

## 和 GitHub 顯示結果一樣嗎

VS Code 預覽接近 GitHub Flavored Markdown，但不保證完全相同。表格、工作清單和刪除線通常相近；Mermaid、HTML、數學公式及擴充語法可能不同。正式發布前，仍應在目標平台檢查一次。

:::tip
對 AI 來說，真正重要的是原始 `.md` 文字，而不是預覽畫面。請確認標題、表格、程式碼區塊和連結在原始檔中仍有清楚的結構。
:::

## 延伸閱讀

- [Markdown 是什麼？](/zh-tw/what-is-markdown/) — 了解 Markdown 的基本用途。
- [Markdown 表格](/zh-tw/tables/) — 解決表格預覽錯位問題。
- [Markdown 程式碼區塊](/zh-tw/code-blocks/) — 正確保留程式碼格式。