js浏览器刷回到顶部_nodeppt一款免费将Markdown文档转成幻灯片并在浏览器演示的工具...

简介

nodeppt是一款将Markdown文档转成幻灯片，在浏览器演示的开源免费好用的工具。最新版本2.1.5，github star 6.9K+, MIT协议。

在线体验地址：

https://nodeppt.js.org/#slide=1

官网截图：

快速上手

简化了，就三个命令：

• new：使用线上模板创建一个新的 md 文件
• serve：启动一个 md 文件的 webpack dev server
• build：编译产出一个 md 文件

# create a new slide with an official template$ nodeppt new slide.md# create a new slide straight from a github template$ nodeppt new slide.md -t username/repo# start local sever show slide$ nodeppt serve slide.md# to build a slide$ nodeppt build slide.md

帮助

# helpnodeppt -h# 获取帮助nodeppt serve -h

演讲者模式

nodeppt 有演讲者模式，在页面 url 后面增加?mode=speaker 既可以打开演讲者模式，双屏同步

Keyboard Shortcuts

• Page: ↑/↓/←/→ Space Home End
• Fullscreen: F
• Overview: -/+
• Speaker Note: N
• Grid Background: Enter

公共资源：public 文件夹

如果项目文件夹下，存在public文件夹，可以直接通过 url 访问，参考webpack dev server的 contentBase 选项。

在build的时候，public 文件夹中的文件会完全 copy 到dist文件夹中

编写

最佳体验是 chrome 浏览器，本来就是给做演示用的，所以就别考虑非 Chrome 浏览器兼容问题了！

• 基本语法

整个 markdown 文件分为两部分，第一部分是写在最前面的配置，然后是使用隔开的每页幻灯片内容。

• 配置

nodeppt 的配置是直接写在 md 文件顶部的，采用 yaml 语法，例如下面配置：

title: nodeppt markdown 演示speaker: 三水清url: https://github.com/ksky521/nodepptjs: - https://www.echartsjs.com/asset/theme/shine.jsprismTheme: solarizedlightplugins: - echarts - mermaid - katex

• title: 演讲主题
• speaker：演讲者
• url：地址
• js：js 文件数组，放到 body 之前
• css：css 文件数组，放到头部
• prismTheme：prism 配色，取值范围 ['dark', 'coy', 'funky', 'okaidia', 'tomorrow', 'solarizedlight', 'twilight']
• plugins：目前支持 echarts，mermaid和 katex 三个插件

插件

目前 nodeppt 支持 图表 echarts，流程图 mermaid，数学符号 KaTeX 三个插件。

总结

nodeppt 2.0这么好用的免费神器，速速用起来。