简单使用Slidev和PPTist

简单使用Slidev和PPTist

1 简介

前端PPT制作有很多优秀的工具包,例如:Slidev、revealjs、PPTist等,Slidev对Markdown格式支持较好,适合与大模型结合使用,选哟二次封装;revealjs适合做数据切换,例如常规的走马灯和单页PPT等,PPTist可直接使用和二次封装。PPTist效果不错。

项目地址

复制代码
# Slidev
https://github.com/slidevjs/slidev

# revealjs
https://github.com/hakimel/reveal.js

# PPTist
https://github.com/pipipi-pikachu/PPTist

2 Vue使用Slidev

2.1 使用vite创建项目

复制代码
# vue3官网
https://cn.vuejs.org/
https://vuejs.org/

# vite官网
https://cn.vitejs.dev/

# 参考地址
https://sli.dev/guide/

安装slidev

复制代码
npm init slidev@latest

初始化过程如下

工程名:vppt;框架:Vue;

复制代码
npm init slidev@latest

  ●■▲
  Slidev Creator  v51.7.1

√ Project name: ... vppt
  Scaffolding project in vppt ...
  Done.

√ Install and start it now? ... yes
√ Choose the package manager >> npm

added 644 packages, and audited 645 packages in 51s

192 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

> dev
> slidev --open



  ●■▲
  Slidev  v51.7.1

  theme       @slidev/theme-seriph
  css engine  unocss
  entry       D:\1_projects\vscode\vppt\slides.md

  public slide show   > http://localhost:3030/
  presenter mode      > http://localhost:3030/presenter/
  slides overview     > http://localhost:3030/overview/
  export slides       > http://localhost:3030/export/
  remote control      > pass --remote to enable

  shortcuts           > restart | open | edit | quit

2.2 简单使用

⚠️ 在VS code中可以安装Slidev插件

复制代码
# 启动Slidev
npm run dev

# 编译Slidev
npm run build

# 导出Slidev
npm run export

访问地址

复制代码
http://localhost:3030/1

简单操作

导出PPT

⚠️ 导出的是图片,无法编辑。

3 简单使用PPTist

从Github上下载PPTist,解压(删除后缀"-master")后按照下面方法初始化。

复制代码
# 初始化依赖包
npm install

# 运行项目
npm run dev

使用页面

AI生成PPT

导出PPT

相关推荐
DeepSeek-大模型系统教程20 分钟前
深入金融与多模态场景实战:金融文档分块技术与案例汇总
人工智能·ai·语言模型·程序员·大模型·大模型学习·大模型教程
我是小哪吒2.03 小时前
书籍推荐-《对抗机器学习:攻击面、防御机制与人工智能中的学习理论》
人工智能·深度学习·学习·机器学习·ai·语言模型·大模型
东临碣石825 小时前
【AI论文】数学推理能否提升大型语言模型(LLM)的通用能力?——探究大型语言模型推理能力的可迁移性
人工智能·语言模型·自然语言处理
c7699 小时前
【文献笔记】Automatic Chain of Thought Prompting in Large Language Models
人工智能·笔记·语言模型·论文笔记
DeepSeek-大模型系统教程15 小时前
推荐 7 个本周 yyds 的 GitHub 项目。
人工智能·ai·语言模型·大模型·github·ai大模型·大模型学习
静心问道1 天前
STEP-BACK PROMPTING:退一步:通过抽象在大型语言模型中唤起推理能力
人工智能·语言模型·大模型
MO2T1 天前
使用 Flask 构建基于 Dify 的企业资金投向与客户分类评估系统
后端·python·语言模型·flask
静心问道1 天前
APE:大语言模型具有人类水平的提示工程能力
人工智能·算法·语言模型·大模型
香宝的最强后援XD1 天前
Cursor无限邮箱续费方法
语言模型·chatgpt·文心一言
静心问道1 天前
SELF-INSTRUCT:使用自生成指令对齐语言模型
人工智能·语言模型·大模型