Slidev:开发者专属的演示文稿神器

简介: Slidev 是专为开发者打造的 Markdown 幻灯片工具,支持代码实时编辑、LaTeX 公式、Mermaid 图表、Vue 组件嵌入等。44.1k+ Star,中文文档完善,开箱即用,让技术分享更高效、优雅!

最近我在逛GitHub时,发现了一个很有意思的项目——Slidev。如果用一句话来总结,那就是:

用 Markdown 写幻灯片,让技术分享更高效、更优雅。

今天就来给大家推荐一下这个项目。

❓为什么选择 Slidev?

作为开发者,我们经常需要做技术分享、产品演示或会议报告。传统的演示工具(如 PowerPoint、Keynote)虽然功能强大,但对于代码展示和实时编程演示往往力不从心。这就是 Slidev 诞生的原因——专为开发者设计的演示文稿工具。

Slidev(Slide + dev)结合了 Markdown 的简洁性和现代 Web 技术的强大功能,让你能够:

  • 🎯 专注于内容,而不是样式调整
  • 💻 优雅地展示代码,支持实时编辑
  • 🚀 快速启动和迭代,享受即时热重载

github地址:https://github.com/slidevjs/slidev

在线地址: https://sli.dev/new

中文文档地址: https://cn.sli.dev/

该项目目前在github上已有44.1k ⭐️star

🎯核心特性一览

📝 Markdown 驱动

用你熟悉的 Markdown 语法编写幻灯片,所有内容都在纯文本文件中,易于版本控制。

🧑‍💻 开发者友好功能

  • 代码高亮:内置语法高亮,支持多种编程语言
  • 实时编程:在演示过程中直接编辑和运行代码
  • 终端模拟:展示命令行操作的真实效果

🎨 强大的样式和主题系统

  • 主题库丰富:从官方和社区主题中选择,或轻松创建自己的主题
  • UnoCSS 集成:使用原子化 CSS 工具快速定制样式
  • 响应式设计:自适应不同屏幕尺寸

🤹 交互式元素

  • 嵌入 Vue 组件:无缝集成交互式组件
  • 动态内容:在幻灯片中使用响应式数据
  • 自定义布局:创建复杂的幻灯片结构

🎙 专业演示功能

  • 演讲者模式:在单独窗口查看笔记和计时器
  • 远程控制:使用手机或其他设备控制幻灯片
  • 画板功能:在幻灯片上实时绘制和标注
  • 录制功能:内置录制和摄像头视图

📚 技术文档友好

  • LaTeX 支持:完美的数学公式渲染
  • Mermaid 图表:用文本描述创建流程图、序列图等
  • 图标系统:直接访问数千个图标

⚡快速开始

🌐在线体验

无需安装,直接在浏览器中体验:sli.dev/new

🖥️本地安装

确保已安装 Node.js (>=18),然后运行:

# 如果你还没有安装 pnpm
npm i -g pnpm

pnpm create slidev

# 如果你希望使用单个 Markdown 文件作为幻灯片,可以全局安装 Slidev CLI:

pnpm i -g @slidev/cli

# 通过以下命令创建并启动幻灯片:

slidev slides.md

🐳Docker 安装

如果你需要快速的在容器上部署你的演示文稿,你可以使用由 tangramor 维护的预构建 docker 镜像。

github地址:https://github.com/tangramor/slidev_docker

我使用的是docker-compose启动的,以下是操作步骤

创建docker-compose.yml文件

services:
  slidev:
    image: tangramor/slidev:latest
    container_name: slidev
    user: "node"
    ports:
      - "3030:3030"
    environment:
      - NPM_MIRROR=https://registry.npmmirror.com
    volumes:
      - ./data:/slidev
    stdin_open: true
    tty: true

在docker-compose.yml同级目录下创建挂载目录并授权

# 创建挂载目录
mkdir data
# 授权
sudo chmod -R 777 ./data

启动容器

docker-compose up -d

查看日志

docker-compose logs -f

如出现以下日志,则说明容器启动成功

启动完成后我们在浏览器中打开地址

在页面上右击则可以看到操作选项

show editor ->编辑md内容

Shitf+右击 打开本地功能

其它以下语法,操作我们就不在此处介绍了,家人们自行尝试吧

🧩 生态系统

Slidev 拥有活跃的社区和丰富的资源:

  • 官方文档:多语言支持(中、英、法、西、俄、葡)
  • 主题画廊:大量现成主题可供选择
  • 插件系统:扩展 Slidev 的功能
  • VS Code 扩展:提供更好的编辑体验

📝结语

无论你是需要做一次技术分享,还是想要创建教学材料,Slidev 都能提供卓越的体验。它的设计理念完美契合开发者的思维方式:

  1. 从简单开始:用 Markdown 快速创建基础幻灯片
  2. 专注于内容:让工具处理样式和布局问题
  3. 优雅演示:享受流畅的演示体验和专业的外观

Slidev 不仅是一个工具,更是一种新的演示文稿创作哲学——将内容的简洁性和功能的强大性完美结合。

目录
相关文章
|
10天前
|
人工智能 自然语言处理 Shell
🦞 如何在 OpenClaw (Clawdbot/Moltbot) 配置阿里云百炼 API
本教程指导用户在开源AI助手Clawdbot中集成阿里云百炼API,涵盖安装Clawdbot、获取百炼API Key、配置环境变量与模型参数、验证调用等完整流程,支持Qwen3-max thinking (Qwen3-Max-2026-01-23)/Qwen - Plus等主流模型,助力本地化智能自动化。
🦞 如何在 OpenClaw (Clawdbot/Moltbot) 配置阿里云百炼 API
|
6天前
|
人工智能 机器人 Linux
保姆级 OpenClaw (原 Clawdbot)飞书对接教程 手把手教你搭建 AI 助手
OpenClaw(原Clawdbot)是一款开源本地AI智能体,支持飞书等多平台对接。本教程手把手教你Linux下部署,实现数据私有、系统控制、网页浏览与代码编写,全程保姆级操作,240字内搞定专属AI助手搭建!
4421 13
保姆级 OpenClaw (原 Clawdbot)飞书对接教程 手把手教你搭建 AI 助手
|
5天前
|
人工智能 安全 机器人
OpenClaw(原 Clawdbot)钉钉对接保姆级教程 手把手教你打造自己的 AI 助手
OpenClaw(原Clawdbot)是一款开源本地AI助手,支持钉钉、飞书等多平台接入。本教程手把手指导Linux下部署与钉钉机器人对接,涵盖环境配置、模型选择(如Qwen)、权限设置及调试,助你快速打造私有、安全、高权限的专属AI助理。(239字)
3747 10
OpenClaw(原 Clawdbot)钉钉对接保姆级教程 手把手教你打造自己的 AI 助手
|
8天前
|
人工智能 JavaScript 应用服务中间件
零门槛部署本地AI助手:Windows系统Moltbot(Clawdbot)保姆级教程
Moltbot(原Clawdbot)是一款功能全面的智能体AI助手,不仅能通过聊天互动响应需求,还具备“动手”和“跑腿”能力——“手”可读写本地文件、执行代码、操控命令行,“脚”能联网搜索、访问网页并分析内容,“大脑”则可接入Qwen、OpenAI等云端API,或利用本地GPU运行模型。本教程专为Windows系统用户打造,从环境搭建到问题排查,详细拆解全流程,即使无技术基础也能顺利部署本地AI助理。
7007 15
|
6天前
|
存储 人工智能 机器人
OpenClaw是什么?阿里云OpenClaw(原Clawdbot/Moltbot)一键部署官方教程参考
OpenClaw是什么?OpenClaw(原Clawdbot/Moltbot)是一款实用的个人AI助理,能够24小时响应指令并执行任务,如处理文件、查询信息、自动化协同等。阿里云推出的OpenClaw一键部署方案,简化了复杂配置流程,用户无需专业技术储备,即可快速在轻量应用服务器上启用该服务,打造专属AI助理。本文将详细拆解部署全流程、进阶功能配置及常见问题解决方案,确保不改变原意且无营销表述。
4571 4
|
4天前
|
人工智能 机器人 Linux
OpenClaw(Clawdbot、Moltbot)汉化版部署教程指南(零门槛)
OpenClaw作为2026年GitHub上增长最快的开源项目之一,一周内Stars从7800飙升至12万+,其核心优势在于打破传统聊天机器人的局限,能真正执行读写文件、运行脚本、浏览器自动化等实操任务。但原版全英文界面对中文用户存在上手门槛,汉化版通过覆盖命令行(CLI)与网页控制台(Dashboard)核心模块,解决了语言障碍,同时保持与官方版本的实时同步,确保新功能最快1小时内可用。本文将详细拆解汉化版OpenClaw的搭建流程,涵盖本地安装、Docker部署、服务器远程访问等场景,同时提供环境适配、问题排查与国内应用集成方案,助力中文用户高效搭建专属AI助手。
2531 5
|
8天前
|
人工智能 JavaScript API
零门槛部署本地 AI 助手:Clawdbot/Meltbot 部署深度保姆级教程
Clawdbot(Moltbot)是一款智能体AI助手,具备“手”(读写文件、执行代码)、“脚”(联网搜索、分析网页)和“脑”(接入Qwen/OpenAI等API或本地GPU模型)。本指南详解Windows下从Node.js环境搭建、一键安装到Token配置的全流程,助你快速部署本地AI助理。(239字)
4621 23
|
14天前
|
人工智能 API 开发者
Claude Code 国内保姆级使用指南:实测 GLM-4.7 与 Claude Opus 4.5 全方案解
Claude Code是Anthropic推出的编程AI代理工具。2026年国内开发者可通过配置`ANTHROPIC_BASE_URL`实现本地化接入:①极速平替——用Qwen Code v0.5.0或GLM-4.7,毫秒响应,适合日常编码;②满血原版——经灵芽API中转调用Claude Opus 4.5,胜任复杂架构与深度推理。
8562 13