企业官网建设流程全解析

一个 Markdown 文件做出幻灯片：Marp for VS Code 安装、预览与导出指南

【免费下载链接】marpThe entrance repository of Markdown presentation ecosystem项目地址: https://gitcode.com/gh_mirrors/mar/marp

Marp 是一套基于 Markdown 的演示文稿工具，Marp for VS Code 是它的官方 VS Code 插件，把普通的 Markdown 预览变成可以放映的幻灯片。它适合经常在 VS Code 里写文档、又想少切几个窗口做技术分享或答辩演示的你：写文本、看效果、导出成品，都在同一个窗口完成。

三分钟跑通：装好插件并打开实时预览

三种安装方式

• 扩展市场：按Ctrl+Shift+X（Mac 为Cmd+Shift+X）打开扩展面板，搜索Marp for VS Code，点安装，等它激活即可。
• 命令行：

  code --install-extension marp-team.marp-vscode

• 源码（开发版）：

  git clone https://gitcode.com/gh_mirrors/mar/marp cd marp npm install && npm run build code --install-extension ./packages/marp-vscode/*.vsix

装好后打开设置（Ctrl+,/Cmd+,），先确认几个常用项：markdown.marp.theme（默认主题，可选default/gaia/uncover）、markdown.marp.enableHtml（是否允许 HTML 标签）、markdown.marp.exportType（默认导出格式）。这几项不改也能用，知道在哪改即可。

打开实时预览，看到第一张幻灯片

新建一个.md文件，在开头写入 front-matter：

--- marp: true --- # 第一张幻灯片 正文写在这里

marp: true是开关，告诉 VS Code 这个文件按 Marp 处理。接着按Ctrl+K V（MacCmd+K V）打开分屏预览，左边打字、右边翻页，改动会立刻反映到幻灯片上 🎬。

为什么值得换：指令系统、Markdown 即幻灯片与双向同步

Marp 把"写 Markdown"和"做幻灯片"合成同一件事，省掉了编辑器与 PPT 软件之间的来回切换。

Markdown 即幻灯片

你熟悉的 Markdown 直接就是幻灯片：#标题当页面主题，---分隔线就是换页，代码块、表格、图片照常可用。周会做技术分享，一个.md文件把代码示例写完就能导出；论文答辩时，纯文本便于修改和留版本，改动一目了然。

指令系统：自动补全与诊断

Marp 用指令控制主题、页码、页眉页脚，写在 front-matter 或 HTML 注释里：

<!-- theme: uncover paginate: true footer: 论文答辩 -->

插件对指令有完整的智能支持 🧩：在指令区按Ctrl+Space触发自动补全，光标悬停显示该指令的说明，拼错的指令名、写错的theme值会直接进"问题"面板报警，不用再靠肉眼排查。

双向同步

编辑区与预览区滚动位置自动对齐，预览可缩放，深浅色跟随 VS Code 主题切换。你改到哪一页，右边就翻到哪一页，不用手动刷新。

导出与发布：一键输出 PDF、HTML、PPTX 和图片

从命令面板导出

命令面板（Ctrl+Shift+P/Cmd+Shift+P）运行Marp: Export Slide Deck，即可导出下列格式，点一下就有，不用记命令：

常用导出参数

要更细的控制就用 Marp CLI：

# 自定义主题、加页码与备注导出 PDF marp --theme custom.css --pdf --slide-number --notes deck.md # 压缩输出体积 marp --pdf --compress deck.md

没装全局命令时，可用npx @marp-team/marp-cli@latest deck.md直接跑一次。

进阶与避坑：自定义主题、工作区信任、Git 协作与常见问题

自定义主题

写一个custom-theme.css，用 CSS 覆盖颜色、标题、代码块样式，然后在设置里挂上：

"markdown.marp.themes": ["./custom-theme.css"]

工作区信任

未受信任的工作区会被限制：导出命令、工作区自定义主题（markdown.marp.themes）、HTML 标签（markdown.marp.enableHtml）都不生效，只保留基础预览与指令支持。需要这些功能时，通过文件 > 管理工作区信任把当前目录设为可信。

Git 协作

幻灯片是纯文本，天然好做版本管理：git diff差异清晰、可并行编辑、历史完整，配合 Pull Request 评审流程很顺。

常见问题速查

后续规划

团队还在推进的有：带幻灯片缩略图的侧边栏、右下角播放按钮、基于 Live Share 的多人协作等，让从其他工具迁移更顺。更多细节可以看 Marp for VS Code 文档、Marp 指令参考 与 安装指南。

【免费下载链接】marpThe entrance repository of Markdown presentation ecosystem项目地址: https://gitcode.com/gh_mirrors/mar/marp