nodeppt 使用笔记，补全作者没写的内容，让你爱上分享

安装

装有node的电脑，打开命令行

npm install nodeppt -g -d

安装完即可开始使用，在电脑上打开一个目录，新建一个 xxx.md 的文件

启动

在你 xxx.md 目录，打开命令行

nodeppt start

启动完成，这种和其他node模块使用方式都差不多，就不多说

xxx.md 的文件基本结构

title: 这是演讲的题目
speaker: 演讲者名字
url: 可以设置链接
transition: 转场效果，例如：zoomin/cards/slide
files: /css/theme.moon.css，尾部的文件
theme: moon //皮肤
highlightStyle: monokai_sublime //hljs的样式
headFiles: //头部的文件
usemathjax: //如果为yes，则引入mathjax，默认不建议开启，导出文件太多
date: 2015年12月20日

[slide]
// 第一页ppt
[slide]
// 第二页ppt

nodeppt 的基本写法

支持 markdowm 语法，具体大家去看 markdown 的教程

title: 演示
speaker: saohui
url: https://www.fenpeiduixiang.com
transition: zoomin

[slide]

# 标题演示

[slide]

* 无需列表
* 无需列表

[slide]

1. 无需列表
2. 无需列表

[slide]

皮肤类型

自己可以试试，看看张什么样，喜欢就用

• colors
• moon（默认）
• blue
• dark
• green
• light

image.png

转场动画类型

• kontext
• vkontext
• circle
• earthquake
• cards
• glue
• stick
• move
• newspaper
• slide
• slide2
• slide3
• horizontal3d
• horizontal
• vertical3d
• zoomin
• zoomout
• pulse

magic（子页面）

magic是在一页幻灯片中播放多个子页面，页面之间进行动效切换，但是slide不翻页（类似keynote的magicmove），使用[magic]标签包裹，子页面之间使用====间隔

写法

[slide]
[magic data-transition="earthquake"]

## 子页1

====

## 子页1

[/magic]

[magic]标签支持全部转场动效，效果比较好的有：

• zoomin/zoomout
• move
• circle
• earthquake
• newspaper
• cover-diamond
• horizontal3d/horizontal
• vertical3d
• cover-circle

单页ppt上下布局

[slide]
## 主页面样式
### ----是上下分界线
----
nodeppt是基于nodejs写的支持 **Markdown!** 语法的网页PPT

列表单条动画

写法

* 上下左右方向键翻页 {:&.moveIn}
    * 列表支持渐显动画 {:&.moveIn}
    * 支持多级列表
    * 这个动画是moveIn

一级列表和二级列表是分开的，所以设置是分别设置

HTML 混编

## 标题

    
这是html

这是css样式
具体看下项目中 ppts/demo.md 代码

给 markdown 语法里面添加 class 或 style

## 字体红色 {: style="color:red"}

[slide]

## 加一个class {:.a }

[slide]

## 加一个Id {:#a }

• 使用：.class {:.class}
• 使用：#id{:#id}
• 组合使用：{:.class.class2 width="200px"}
• 父元素样式使用&：{:&.class}

内部提供的 class

• .columns1 /2/3/4 提供 flex 布局，在 html 混编的时候可以使用
• 字体状态/颜色
  • .text-danger
  • .text-sucess
  • .text-primary
  • .text-warning
  • .text-info
  • .text-white
  • .text-dark
  • .blue
  • .blue2
  • .blue3
  • .gray
  • .gray2
  • .gray3
  • .red
  • .red2
  • .red3
  • .yellow
  • .yellow2
  • .yellow3
  • .green
  • .green2
  • .green3
• label
  • .label.label-primary
  • .label.label-warning
  • .label.label-danger.label
  • .label-default.label
  • .label-success
  • .label.label-info
• btn
  • .btn.btn-default
  • .btn.btn-lg
  • .btn-primary
  • .btn.btn-waring
  • .btn.btn-success
  • .btn.btn-danger
  • .btn.btn-lg
  • .btn-default
  • .btn.btn-xs
  • .btn-success
  • .btn.btn-sm
  • .btn-primary
  • .btn.btn-rounded
  • .btn.btn-waring

image.png

image.png

页面中添加笔记

[note]
这里是note，在页面的时候 按 N 可以查看
[/note]

快捷键

• H 动画样式强调
• N 看笔记
• P 画笔
  • B/Y/R/G/M 更换颜色
  • 按 【1~4】 更换粗细
  • C 清空画笔
• W 扩展宽度
• O overview模式（像ppt的页面列表全部展开）
• alt 在演示过程中使用alt+鼠标点击，则点击的地方就开始放大，再次alt+click则恢复原状
• enter 在页面中输入数字，直接按 enter 会直接进入那一页

ps

• 很多地方我也没写，比如回调函数、怎么双屏控制等，只写了简易教程，和一些作者没有写的 api，为了是方便自己使用时候记忆
• 作者github使用说明书：https://github.com/ksky521/nodeppt