如何利用vscode高效编写Markdown文档【教程】

VS Code可通过三个核心插件（markdown All in One、Markdown Preview Mermaid Support、Code Spell Checker）和三项关键配置（禁用自动预览、手动唤出、图片自动存入assets）打造高效Markdown环境。

VS Code 本身不是 Markdown 编辑器，但通过合理配置和插件组合，它能成为目前最灵活、可定制性最强的 Markdown 工作环境——前提是避开默认设置里的几个典型陷阱。

安装哪些插件才真正有用

别装“Markdown All in One”+“Preview Enhanced”+“Paste Image”这种堆砌式组合。多数人只需要三个核心插件：

• Markdown All in One：提供快捷键（如 Ctrl+Shift+V 双窗格预览）、目录生成（Ctrl+K Ctrl+T）、自动补全（## 后按 Tab 补标题层级）
• Markdown Preview Mermaid Support：让 mermaid 图表在预览中直接渲染，不用额外配 webview 或导出
• Code Spell Checker：专为技术文档优化的拼写检查，支持忽略代码块、行内代码（` 包裹内容）和 YAML frontmatter

其他如“Markdown pdf”或“Markdown Emoji”属于一次性需求工具，用时再装更省资源。

预览窗口卡顿、刷新延迟怎么办

VS Code 内置预览默认监听整个工作区，文件一多就卡。根本解法是关掉自动刷新，改用手动触发：

• 在 settings.json 中添加："markdown.preview.autoShowPreviewPanel": false
• 用快捷键 Ctrl+K V（windows/linux）或 Cmd+K V（macOS）按需唤出预览面板
• 禁用 "markdown.preview.doubleClickToswitchToEditor"，避免误点退出编辑模式
• 如果文档含大量 mermaid 或数学公式，建议关闭 "markdown.preview.mathjax": true，改用 KaTeX（需额外配置）提升加载速度

图片插入总要手动改路径？

VS Code 默认不处理图片粘贴和相对路径。关键设置在 settings.json 里两处：

• "markdown.extension.italic.indicator": "_" 这类无关项不用动；重点是："markdown.extension.imageUploader.action": "copy"
• 配合 "markdown.extension.imageUploader.uploadMethod": "none"，粘贴图片时自动存入 ./assets/ 并插入相对路径（如 ![alt](assets/image.png)）
• 确保工作区根目录下有 assets/ 文件夹，否则会报错 Unable to write file ... Permission denied
• 别依赖“从资源管理器拖拽图片”，它生成的是绝对路径，跨设备即失效

真正影响效率的从来不是功能多少，而是每次插入图片、更新目录、导出 PDF 时是否要打断思路去查文档或调设置。把上面三处配好，剩下的就是写。