decktape, 用于HTML表示框架的PDF导出程序

分享于 

9分钟阅读

GitHub

  繁體 雙語
PDF exporter for HTML5 presentation frameworks
  • 源代码名称:decktape
  • 源代码网址:http://www.github.com/astefanutti/decktape
  • decktape源代码文档
  • decktape源代码下载
  • Git URL:
    git://www.github.com/astefanutti/decktape.git
    Git Clone代码到本地:
    git clone http://www.github.com/astefanutti/decktape
    Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/astefanutti/decktape
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
    
    DeckTape

    decktapedecktape

    DeckTape是用于HTML表示框架的高质量PDF导出程序。

    DeckTape构建在 Puppeteer之上,它依靠来布局和呈现网页,并提供一个无头的Chrome 实例,可以使用 JavaScript API编写脚本。

    DeckTape目前支持下面的演示框架:

     • Bespoke.js  • DZSlides  • remark  • Shower • CSSS  • Flowtime.js  • reveal.js  • Slidy • deck.js  • impress.js  • RISE  • WebSlides

    DeckTape还提供了一个通过模拟最终用户交互来工作的通用命令插件,允许使用它来从几乎任何类型的框架转换演示文稿。 通用模式对于支持不公开API或者可以访问状态的HTML表示框架特别有用。

    基于decktape架构的插件公开了一个扩展 API,可以为它的他框架添加支持或者对现有的插件进行定制。

    DeckTape可以用于在各种分辨率( 类似于 pageres ) 中捕获幻灯片屏幕的截图。 确保演示文稿响应响应或者为它们创建讲义是很有用的。

    你可以浏览一些幻灯片 deck 示例 below,这些示例是通过DeckTape导出的。

    安装

    NPM

    全局安装DeckTape并运行它:

    $ npm install -g decktape
    $ decktape

    或者本地:

    $ npm install decktape
    $ `npm bin`/decktape

    用法

    
    $ decktape -h
    
    
    
    Usage: decktape [options] [command] <url> <filename>
    
    
     decktape version
    
    
    
    command one of: automatic, bespoke, csss, deck, dzslides, flowtime, generic, impress,
    
    
     remark, reveal, shower, slidy, webslides
    
    
    url URL of the slides deck
    
    
    filename Filename of the output PDF file
    
    
    
    Options:
    
    
     -s <size>, --size <size> Size of the slides deck viewport: <width>x<height> (e.g. '1280x720')
    
    
     -p <ms>, --pause <ms> Duration in milliseconds before each slide is exported [1000]
    
    
     --load-pause <ms> Duration in milliseconds between the page has loaded
    
    
     and starting to export slides [0]
    
    
     --screenshots Capture each slide as an image [false]
    
    
     --screenshots-directory <dir> Screenshots output directory [screenshots]
    
    
     --screenshots-size <size> Screenshots resolution, can be repeated [--size]
    
    
     --screenshots-format <format> Screenshots image format, one of [jpg, png] [png]
    
    
     --slides <range> Range of slides to be exported, a combination of slide indexes
    
    
     and ranges (e.g. '1-3,5,8')
    
    
    
    Defaults to the automatic command.
    
    
    Iterates over the available plugins, picks the compatible one for presentation at the
    
    
    specified <url> and uses it to export and write the PDF into the specified <filename>.
    

    除了列出的常规选项 上面 之外,还可以按以下方式显示命令特定选项:

    $ decktape <command> -h

    命令

    automatic

    在可用的插件上迭代,在指定的中选择兼容的插件,并使用它将导出并写到指定的filename 文件中。

    generic

    通过按下指定的--key 选项并迭代演示文稿,可以模拟最终用户交互,并在以下情况下:

    通过观察针对 body 元素及其子树的突变事件,可以检测到DOM的任何变化,也可以通过

    导出的幻灯片数已经达到指定的--max-slides 选项。

    --key 值必须是 UI事件 KeyboardEvent 键值和默认到 ArrowRight,e.g.:

    $ decktape generic --key=ArrowDown

    命令行选项

    --screenshots

    --screenshots-size 分辨率下捕获每个幻灯片作为图像,将它的导出到 --screenshots-format 图像格式,并将输出写入 --screenshots-directory 目录。

    可以多次设置 --screenshots-size 选项。 例如:

    $ decktape --screenshots --screenshots-size=400x300 --screenshots-size=800x600

    --slides

    仅导出指定为一系列幻灯片索引和范围的幻灯片,e.g.:

    # Capture a single slide$ decktape --slides 1# Capture a series of slides$ decktape --slides 1,3,5# Capture a range of slides$ decktape --slides 1-10# Capture a combination of slides and ranges$ decktape --slides 1,2,5-10

    渲染停止后,输出最大编号幻灯片后写出的文件。

    示例

    以下幻灯片示例示例已经使用DeckTape导出:

    HTML5演示框架导出了 PDF
    ES6+ maintenantreveal.jsdevoxx-es6-maintenant.pdf ( 2 mb )
    reveal.js MathJax示例reveal.jsreveal-js-mathjax.pdf ( 0 mb )
    涉及到开源服务。reveal.jsopensource-getting-involved.pdf ( 0 )
    正在进一步处理CDI问题Asciidoctor + DZSlidesgoing-further-with-cdi.pdf ( 2 mb )
    Deck.js 现代HTML演示文稿deck.jsdeck-js-presentation.pdf ( 0.5mb )
    官方备注幻灯片放映。备注remark-js-slideshow.pdf ( 0 15mb )
    彩色终端清单,备注。备注remark-js-coloured-terminal.pdf ( 0 12MB )
    HTML Slidy: 幻灯片显示在HTML和XHTML中。Slidyhtml-slidy-presentation.pdf ( 0.5mb )
    CSSS: 基于css的幻灯片放映系统。CSSScsss-sample-slideshow.pdf ( mb )
    淋浴演示引擎淋浴间shower-presentation-engine.pdf ( 0 )
    欢迎我们的新 ES5 Overloards服务。Bespoke.jsnew-es5-overloards.pdf ( 0 mb )
    眼镜:一个ReactJS表示库。Spectaclespectacle-reactjs-presentation.pdf ( 8 9mb )

    Docker

    可以使用 Docker-Hub 上可用的 astefanutti/decktape Docker 映像在命令行中从命令行执行 DeckTape:

    $ docker run astefanutti/decktape -h

    例如:

    • 要转换联机HTML演示文稿并将它的导出到 slides.pdf 文件名下的工作目录中:

      $ docker run --rm -t -v `pwd`:/slides astefanutti/decktape http://lab.hakim.se/reveal-js slides.pdf
    • 要转换存储在 home 目录中的本地文件系统上的HTML演示文稿,请执行以下操作:

      $ docker run --rm -t -v `pwd`:/slides -v ~:/home/user astefanutti/decktape/home/user/slides.html slides.pdf
    • 要转换在本地主机上部署的HTML演示文稿,请执行以下操作:

      $ docker run --rm -t --net=host -v `pwd`:/slides astefanutti/decktape http://localhost:8000 slides.pdf

    你可以能需要指定一个对应于 Docker 映像的DeckTape版本的标记,比如 astefanutti/decktape:2.0.0

    此外,建议使用 docker run 命令中的以下选项:

    --rm

    DeckTape应该作为一个短期的前景过程,以便在DeckTape退出之后容器系统的文件保持不变。

    -v

    挂载数据卷以便DeckTape可以直接写入本地文件系统。

    或者,你也可以使用 docker cp 命令,e.g.:

    # Run docker run without the --rm option$ docker run astefanutti/decktape http://lab.hakim.se/reveal-js slides.pdf# Copy the exported PDF from the latest used container to the local file system$ docker cp `docker ps -lq`:slides/slides.pdf .# Finally remove the latest used container$ docker rm `docker ps -lq`

    插件插件 API


      framework  EXP  PRE  PDF  导出  
    相关文章