VS Code 插件
我们提供了 VS Code 插件，以提高使用此主题创建 Slidev 演示文稿的效率。
功能特点
- 🎯 侧边栏面板 - 快速访问布局、组件、模板、主题和参考文献
- ✨ 代码片段 - 输入
ss-或scholarly-触发布局和组件的代码片段 - 📝 一键插入/应用 - 点击面板中的项目即可插入内容或更新 frontmatter
- 🚀 新建演示 - 创建带有预配置模板的新演示文稿
- 🎨 主题预设 - 在 Themes 面板中一键应用
themeConfig.colorTheme/themeConfig.fontTheme - 📚 BibTeX 参考文献 - 引用补全、悬浮预览，以及 References 面板浏览/插入 cite key
安装方法
从 VSIX 文件安装
- 从 GitHub 发布页面 下载
.vsix文件 - 在 VS Code 中，按
Cmd+Shift+P（Mac）或Ctrl+Shift+P（Windows/Linux）打开命令面板 - 输入 "Extensions: Install from VSIX" 并选择下载的文件
- 重新加载 VS Code
使用方法
使用代码片段
在任何 Markdown 文件中输入前缀以触发自动完成：
markdown
ss-cover # 插入封面布局
ss-theorem # 插入定理组件
ss-block # 插入信息块组件
scholarly-cite # 插入引用按 Tab 键在插入的代码片段中的占位符之间移动。
使用侧边栏
- 点击侧边栏（左侧）中的 Slidev Scholarly 图标
- 浏览五个部分：
- Layouts（布局） - 按类别组织的幻灯片布局：
- 结构布局 - cover、default、intro、section、center、auto-center、end
- 内容布局 - two-cols、image-left/right、bullets、figure、split-image
- 强调布局 - quote、fact、statement、focus
- 学术布局 - compare、methodology、results、timeline、agenda、acknowledgments、references
- Components（组件） - 内置 Vue 组件
- Templates（模板） - 预制的演示文稿模板
- Themes（主题） - 应用主题预设（会更新 frontmatter）
- References（参考文献） - 浏览 BibTeX 条目并插入 cite key
- Layouts（布局） - 按类别组织的幻灯片布局：
- 点击任意项目（或有
+的地方点击+）即可插入/应用
创建新演示文稿
- 打开命令面板（
Cmd+Shift+P/Ctrl+Shift+P） - 输入 "Slidev Scholarly: New Presentation"
- 选择位置和文件名
- 将创建一个包含基本模板的新文件
可用的代码片段
布局片段
布局按四个类别组织。你可以使用类别前缀（ss-structure-*、ss-content-*、ss-emphasis-*、ss-academic-*）或简短的 ss-* 前缀。
结构布局
| 前缀 | 描述 |
|---|---|
ss-cover | 封面/标题幻灯片 |
ss-default | 默认内容幻灯片 |
ss-intro | 章节介绍 |
ss-section | 章节分隔符（支持 sectionMode: dark/light） |
ss-center | 居中内容 |
ss-auto-center | 自动调整的居中内容 |
ss-end | 致谢/结束幻灯片 |
内容布局
| 前缀 | 描述 |
|---|---|
ss-two-cols | 双栏布局 |
ss-image-left | 左图右文 |
ss-image-right | 左文右图 |
ss-bullets | 增强列表 |
ss-figure | 带标题的学术图片 |
ss-split-image | 并排图片对比 |
强调布局
| 前缀 | 描述 |
|---|---|
ss-quote | 带出处的引用 |
ss-fact | 单个事实/统计数据 |
ss-statement | 重要陈述 |
ss-focus | 带图标的聚焦陈述 |
学术布局
| 前缀 | 描述 |
|---|---|
ss-compare | 并排对比 |
ss-methodology | 研究方法 |
ss-results | 结果仪表板 |
ss-timeline | 研究时间线 |
ss-agenda | 议程概览 |
ss-acknowledgments | 致谢幻灯片 |
ss-references | 参考文献幻灯片 |
组件片段
| 前缀 | 描述 |
|---|---|
ss-theorem | 定理/引理/定义 |
ss-block | Beamer 风格彩色块 |
ss-steps | 工作流程/步骤 |
ss-steps-md | 工作流程/步骤（Markdown 语法糖） |
ss-keywords | 关键词标签 |
ss-keywords-md | 关键词标签（Markdown 语法糖） |
ss-columns | 多列布局 |
ss-columns-md | 多列布局（Markdown 语法糖） |
ss-highlight | 文本高亮 |
ss-highlight-md | 文本高亮（Markdown 语法糖） |
ss-cite | BibTeX 引用 @citekey |
ss-cite-comp | Cite 组件（非 BibTeX） |
ss-cite-md | Cite 组件（Markdown 语法糖） |
ss-theme-preview | ThemePreview 组件 |
scholarly-bibliography | 参考文献占位符 |
主题预设片段
| 前缀 | 描述 |
|---|---|
ss-theme-oxford | Oxford 酒红 + Traditional 字体 |
ss-theme-cambridge | Cambridge 绿 + Elegant 字体 |
ss-theme-yale | Yale 蓝 + Classic 字体 |
ss-theme-princeton | Princeton 橙 + Modern 字体 |
ss-theme-modern | 单色 + Sans-default 字体 |
实用片段
| 前缀 | 描述 |
|---|---|
ss-frontmatter | 完整的 frontmatter 配置 |
ss-slide / --- | 幻灯片分隔符 |
使用技巧
快速选择布局
当你需要特定布局时，只需输入 ss- 并浏览自动完成建议。每个片段都包含常用选项的有用占位符。
与 Markdown 语法糖结合使用
该插件与 Markdown 语法糖 功能配合良好。你可以使用：
markdown
<!-- 使用 Vue 组件（来自代码片段） -->
<Theorem type="theorem" title="主要结果">
内容
</Theorem>
<!-- 使用 Markdown 指令 -->
:::theorem{type="theorem" title="主要结果"}
内容
:::自定义代码片段
如果你想修改代码片段，可以：
- 打开 VS Code 设置
- 搜索 "Configure User Snippets"
- 选择 "markdown.json"
- 添加你的自定义片段
故障排除
代码片段不显示
- 确保插件已安装并启用
- 检查你是否正在编辑
.md文件 - 尝试按
Ctrl+Space手动触发建议
侧边栏图标缺失
- 右键点击侧边栏
- 确保 "Slidev Scholarly" 已勾选
反馈
发现 bug 或有功能需求？请在 GitHub 上提交 issue。