簡單使用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: ... vpptScaffolding project in vppt ...Done.√ Install and start it now? ... yes
√ Choose the package manager ? npmadded 644 packages, and audited 645 packages in 51s192 packages are looking for fundingrun `npm fund` for detailsfound 0 vulnerabilities> dev
> slidev --open●■▲Slidev  v51.7.1theme       @slidev/theme-seriphcss engine  unocssentry       D:\1_projects\vscode\vppt\slides.mdpublic 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 enableshortcuts           > 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
在這里插入圖片描述

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/906366.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/906366.shtml
英文地址,請注明出處:http://en.pswp.cn/news/906366.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

數據挖掘:從數據堆里“淘金”,你的數據價值被挖掘了嗎?

數據挖掘:從數據堆里“淘金”,你的數據價值被挖掘了嗎? 在這個數據爆炸的時代,我們每天都在產生海量信息:社交媒體上的點贊、網購時的瀏覽記錄,甚至是健身手環記錄下的步數。這些數據本身可能看似雜亂無章…

程序運行報錯分析文檔

zryhuawei:~/src/modules/Connect$ ./newbuild/OpConnectAidTool \WARNING: MYSQL_OPT_RECONNECT is deprecated and will be removed in a future version. replace into process_tracking (step_id,date,status,context_data,start_time,end_time,error_log) values(?,?,?…

基于flask+vue的電影可視化與智能推薦系統

基于flaskvue爬蟲的電影數據的智能推薦與可視化系統,能展示電影評分、評論情感分析等直觀的數據可視化圖表,還能通過協同過濾算法為用戶提供個性化電影推薦,幫助用戶發現更多感興趣的電影作品,具體界面如圖所示。 本系統主要技術架…

BYUCTF 2025

幾周沒會的比賽了,都是一題游。這周的BYU還不錯,難度適中,只是時間有點短。周末時間不夠。 Crypto Many Primes from Crypto.Util.number import bytes_to_long, getPrime import randomflag open("flag.txt").read().encode()…

鏈表的面試題8之環形鏈表

許久不見,那么這是最后倒數第三題了,這道題我們來看一下環形鏈表。 老規矩貼鏈接:141. 環形鏈表 - 力扣(LeetCode) 目錄 倒數第k個元素 獲取中間元素的問題。 雙指針 來,大致看一下題目,這…

在 JavaScript 中正確使用 Elasticsearch,第二部分

作者:來自 Elastic Jeffrey Rengifo 回顧生產環境中的最佳實踐,并講解如何在無服務器環境中運行 Elasticsearch Node.js 客戶端。 想獲得 Elastic 認證?查看下一期 Elasticsearch Engineer 培訓的時間! Elasticsearch 擁有大量新…

2025年網站安全防御全解析:應對DDoS與CC攻擊的智能策略

2025年,隨著AI技術與物聯網設備的深度融合,DDoS與CC攻擊的規模與復雜度持續升級。攻擊者不僅利用T級流量洪泛沖擊帶寬,還通過生成式AI偽造用戶行為,繞過傳統防御規則。如何在保障業務高可用的同時抵御混合型攻擊?本文將…

window 安裝 wsl + cuda + Docker

WSL 部分參考這里安裝: Windows安裝WSL2 Ubuntu環境 - 知乎 如果出現錯誤: WslRegisterDistribution failed with error: 0x800701bc 需要運行:https://crayon-shin-chan.blog.csdn.net/article/details/122994190 wsl --update wsl --shu…

《MambaLLIE:基于隱式Retinex感知的低光照增強框架與全局-局部狀態空間建模》學習筆記

Paper:2405.16105 Github:GitHub - wengjiangwei/MambaLLIE 目錄 摘要 一、介紹 二、相關工作 2.1 低光圖像增強 2.2 視覺空間狀態模型 三、方法 3.1 預備知識 3.2 整體流程 3.3 全局優先-局部次之狀態空間塊 四、實驗 4.1 基準數據集與實施細節 4.2 對比實驗 4…

微信小程序:封裝request請求、解決請求路徑問題

一、創建文件 1、創建請求文件 創建工具類文件request.js,目的是用于發送請求 二、js接口封裝 1、寫入接口路徑 創建一個變量BASE_URL專門存儲api請求地址 2、獲取全局的token變量 從緩存中取出token的數據 3、執行請求 (1)方法中接收傳遞的參數 function request(url,…

【單機版OCR】清華TH-OCR v9.0免費版

今天向大家介紹一款非常好用的單機版OCR圖文識別軟件,它不僅功能多,識別能力強,而且還是免費使用的。OCR軟件為什么要使用單機版,懂得都懂,因為如果使用在線識別的OCR軟件,用戶需要將文檔上傳互聯網服務器的…

開源情報搜集系統:科研創新的強大引擎

一、引言 在當今全球化和信息化高度發展的時代,科研活動面臨著前所未有的機遇與挑戰。一方面,知識的更新換代速度極快,科研成果如雨后春筍般不斷涌現;另一方面,科研競爭日益激烈,如何在眾多科研團隊中脫穎…

產品生命周期不同階段的營銷策略

產品生命周期的不同階段(導入期、成長期、成熟期、衰退期)需要匹配差異化的營銷策略。以下是各階段的營銷重點及具體策略: 1. 導入期(Introduction Stage) 核心目標:建立市場認知,快速觸達目標…

Mujoco 學習系列(二)基礎功能與xml使用

這篇文章是 Mujoco 學習系列第二篇,主要介紹一些基礎功能與 xmI 使用,重點在于如何編寫與讀懂 xml 文件。 運行這篇博客前請先確保正確安裝 Mujoco 并通過了基本功能與GUI的驗證,即至少完整下面這個博客的 第二章節 內容: Mujoc…

面向SDV的在環測試深度解析——仿真中間件SIL KIT應用篇

1.引言 在汽車行業向軟件定義汽車(SDV)轉型的過程中,傳統硬件在環(HIL)測試方案因難以適應新的技術架構與需求,其局限性日益凸顯。傳統HIL對硬件依賴性強,擴展性差,更換ECU或傳感器…

windows使用anaconda安裝pytorch cuda版本

Windows安裝PytorchCUDA環境_使用conda安裝pytorch cuda10.2版本-CSDN博客

Axure中使用動態面板實現圖標拖動交換位置

要在Axure中實現圖標拖動交換位置的功能,可以通過動態面板結合交互事件來實現。 實現步驟 準備圖標元素 將每個圖標轉換為動態面板(方便拖動和交互)。 設置拖動交互 選中圖標動態面板 → 添加“拖動時”交互 → 選擇“移動”當前動態面板&am…

從零開始的嵌入式學習day24

標準IO 頭文件需求&#xff1a; #include <stdio.h>1.fopen和fclose (1)fopen fopen的函數功能是打開一個文件。 首先看看fopen的函數聲明&#xff1a; FILE *fopen(const char *path, const char *mode);第一個參數path是文件地址&#xff0c;傳入的是不可變的字符…

抓包分析工具與流量監控軟件

目錄 一、抓包分析工具&#xff1a;定位問題的“放大鏡” 1.1 工作原理簡述 1.2 主流工具盤點 1.3 抓包的實戰應用 二、流量監控軟件&#xff1a;網絡全景的“雷達系統” 2.1 功能特征 2.2 常用工具概覽 2.3 實戰應用場景 五、結語&#xff1a;深入可見&#xff0c;安…

DRIVEGPT4: 通過大語言模型實現可解釋的端到端自動駕駛

《DriveGPT4: Interpretable End-to-End Autonomous Driving via Large Language Model》 2024年10月發表&#xff0c;來自香港大學、浙江大學、華為和悉尼大學。 多模態大型語言模型&#xff08;MLLM&#xff09;已成為研究界關注的一個突出領域&#xff0c;因為它們擅長處理…