介绍
@deck/presenter是一个基于Web技术的演示文稿工具，可以用于创建美观的演示文稿。它是一个npm包，使用起来十分方便。
安装
在使用@deck/presenter之前，需要确保你已经安装了Nodejs和npm。然后在终端执行以下命令将其安装到您的项目中：
npm install @deck/presenter
使用
安装完成后，你需要做以下几步来创建一个演示文稿：
1.编写Html文件
@deck/presenter依赖于html文件作为演示文稿的内容。因此，你需要编写一个包含你的演示内容的html文件。你可以使用你喜欢的文本编辑器来编写，也可以使用现成的模板，例如：
-- -------------------- ---- ------- --------- ----- ------ ------ ----- ---------------- --------------------- ---- ------------------- --- ----- ---------------- -------------------------------------------------------------- ------- ------ ---- ----------------------- ---- -------------- --- -------- -------------- ------------ ---------------- ---------- -------- -------------- ------------ ---------------- ---------- ---- ------- --- ------ ---- ------------------- --- ------- --------------------------------------------------------------------- -------- -- ------- ------------ --------- ------- -------展开代码
注意，这个html文件中包含两个步骤：引入@deck/presenter样式和脚本以及编写演示内容。必须全部包含才能正常运行演示文稿。
2.启动演示
完成步骤1后，你可以在浏览器中查看你的演示文稿。只需要在终端中执行以下命令，就可以在浏览器中启动演示：
npm run presenter path/to/your/html
其中， path/to/your/html 是你刚才编写的html文件路径。
3.控制演示
启动演示后，你可以使用键盘或鼠标来控制演示：
←或↑：上一个slide→或↓：下一个slideb或<space>：黑屏或显示（黑屏时再按一次可以恢复显示）f：全屏或取消全屏s：自动播放或停止自动播放p：切换到演讲者视图或退出演讲者视图
示例代码
下面是一个简单的演示文稿示例，包含两个slide：
-- -------------------- ---- ------- --------- ----- ------ ------ ----- ---------------- --------------------- ----- ---------------- -------------------------------------------------------------- ------- ------ ---- ----------------------- -------- -------------- ------------ ---------------- ---------- -------- -------------- ------------ ---------------- ---------- ------ ------- --------------------------------------------------------------------- -------- ------------ --------- ------- -------展开代码
保存为mydeck.html，然后在终端运行以下命令启动演示：
npm run presenter mydeck.html
结论
@deck/presenter是一个非常优秀的演示文稿工具，它十分易于上手，同时提供了丰富的交互控制方式。如果你需要做一个漂亮的演示文稿，不妨一试。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/150503
