不作 PPT 工程师,文档一键 PPT 展现

Why?

对于程序员而言,除了编码,咱们还有形形色色的软素质须要提高,其中分享能力是其中尤其重要的一点,一个好的分享须要分享者的努力。git

包括:分享者调动气氛的能力,内容的质量、甚至还包括分享的形式和工具。一个好的分享形式和工具能为本身的分享增色很多。程序员

How?

分享者调动气氛的能力,内容的质量须要分享者自己多学习,多总结;而外界的分享形式是能够短期内获得提高的。github

想象一个场景:小牛同窗在项目中作了一些很好的优秀实践,而且沉淀出很好的文档内容,但仅仅只是这样?扩散面和影响力仍是不够的。web

小牛开始在小组中或大团队中进行分享,可是若是为了分享,而去单独写 PPT,那就本末倒置了。由于 PPT 的内容基本都已经在文档中。chrome

因此,一键转换文档为 PPT 的脚本应运而生markdown

What?

脚本依赖 Chrome 暴力猴插件(一个能够自定义注入脚本的插件,如百度云盘破解下载等脚本) 脚本地址:知乎 PPTide

很简单的安装以后,进入知乎专栏文档页面,右上角就会出现 PPT 按钮!工具

同窗们能够根据本身的爱好书写的文档平台,注入本身的脚本
能够参考 知乎 PPT 脚本和 GitHub 说明配置oop

在线Demo学习

GitHub: github.com/imcuttle/sl…

快捷键列表:

  • ESC / O : 打开总体预览模式
  • Cmd + ESC / Ctrl + ESC: 退出 PPT 模式
  • 方向键:PPT 翻页

原理

解析 DOM 树,生成树结构以下:

<h1>标题</h1>
<p>内容</p>
<h2>标题2</h2>
<p>内容2</p>
复制代码

会解析成

{
  type: 'lvl',
  level: 1,
  value: '标题',
  children: [
    {
      type: 'text',
      value: '内容'
    },
    {
      type: 'lvl',
      level: 2,
      value: '标题2',
      children: [
        {
          type: 'text',
          value: '内容2'
        }
      ]
    }
  ]
}
复制代码