Slidev — Presentation Slides for Developers
Slidev is a Markdown-based presentation tool for developers. Write slides in Markdown, render with Vue components, use code highlighting with animations, live coding, LaTeX math, diagrams, and export to PDF or SPA. Powered by Vite for instant hot reload.
先审查再安装
这个资产需要先审查。复制的指令会要求 Agent dry-run、列出写入项,确认后再继续。
npx -y tokrepo@latest install ce6e1004-3651-11f1-9bc6-00163e2b0d79 --target codex先 dry-run,确认写入项后再运行此命令。
What it is
Slidev is a Markdown-based presentation tool designed for developers. You write slides in Markdown, use Vue components for interactivity, and get code syntax highlighting with animations, live coding capabilities, LaTeX math rendering, Mermaid diagrams, and export to PDF or SPA.
This tool targets developers who present at conferences, team meetings, or internal demos and want to stay in their code editor rather than switching to PowerPoint or Google Slides.
How it saves time or tokens
Slidev keeps presentations in version-controllable Markdown files. No binary formats, no drag-and-drop alignment, no theme wrestling. A developer familiar with Markdown can create a polished presentation in minutes. Code blocks render with proper syntax highlighting and can even run live during the presentation. For AI-assisted content creation, generating slide content in Markdown is straightforward.
How to use
- Install Slidev via npm.
- Create a
slides.mdfile with slide separators. - Run the dev server to preview.
- Present from the browser or export to PDF.
# Create a new Slidev project
npm init slidev@latest
# Start the dev server
npx slidev
# Export to PDF
npx slidev export
# Build as SPA for hosting
npx slidev build
Example
A slides.md file:
---
theme: seriph
title: My Tech Talk
---
# Welcome to My Talk
Building better tools with Rust
---
Why Rust?
- Memory safety without garbage collection
- Zero-cost abstractions
- Fearless concurrency
Code Example
fn main() {
let numbers = vec![1, 2, 3, 4, 5];
let sum: i32 = numbers.iter().sum();
println!('Sum: {}', sum);
}
Questions?
Find me on GitHub @username
Each `---` separator creates a new slide.
Related on TokRepo
- Documentation tools — More developer documentation tools
- Content creation tools — AI-assisted content creation
Common pitfalls
- Slidev requires Node.js. If your machine does not have Node installed, the setup adds friction.
- Custom Vue components in slides add complexity. For simple presentations, stick to Markdown and built-in layouts.
- PDF export uses Playwright under the hood. The first export downloads a browser binary, which can be slow.
- Presenter notes are supported but require the presenter view mode, which needs a second browser window.
- Animations and transitions work well in the browser but may not render correctly in exported PDFs.
- Review the official documentation before deploying to production to ensure compatibility with your specific environment and requirements.
常见问题
Yes. Slidev has a theme ecosystem with community themes available via npm. You can also create custom themes. Set the theme in the frontmatter of your slides.md file.
Yes. Slidev supports Monaco Editor integration for live coding during presentations. You can edit and run code directly in your slides while presenting.
Yes. Run `npx slidev export` to generate a PDF of your slides. The export uses Playwright to render each slide. You can also export to PNG images for each slide.
Yes. Add speaker notes below each slide using HTML comments. The presenter view displays notes alongside the current slide, similar to PowerPoint presenter view.
Yes. Run `npx slidev build` to generate a static SPA that you can deploy to any hosting service: GitHub Pages, Netlify, Vercel, or your own server. The built output is a self-contained web application.
引用来源 (3)
- Slidev GitHub— Slidev is a Markdown-based presentation tool for developers
- Slidev Documentation— Slidev documentation and theme ecosystem
- Vue.js Documentation— Vue.js component system for interactive presentations
讨论
相关资产
Marp — Create Presentation Slides from Markdown
A Markdown-based presentation ecosystem with a CLI, VS Code extension, and browser-based engine that converts Markdown files into HTML, PDF, and PowerPoint slide decks.
Spectacle — Build Interactive Presentations with React
Spectacle is a React-based presentation library that lets developers create slide decks using JSX components, with built-in animations, themes, and live code editing.
Zeal — Offline Documentation Browser for Developers
Zeal is a free offline documentation browser inspired by Dash. It gives developers instant access to 200+ docsets for languages, frameworks, and tools without an internet connection.
impress.js — Stunning CSS3 Presentation Framework
A presentation framework that leverages CSS3 transforms and transitions to create visually impressive slideshows in the browser, inspired by the idea behind prezi.com.