Skip to content

Latest commit

 

History

History
133 lines (111 loc) · 6.08 KB

REFERENCE.md

File metadata and controls

133 lines (111 loc) · 6.08 KB

CodeSlide CLI Reference

Commands and Options

  • codeslide-cli -h: Check all options and their description
  • codeslide-cli -v: Check the version number
  • codeslide-cli -m [local_path]: The "manifest file path" of slideshow. By default it reads manifest from stdin.
  • codeslide-cli -o [local_path]: The "output file path" of slideshow. By default it writes the output to stdout.

Manifest file specifications

  1. A Markdown text file with UTF-8 encoding
  2. The manifest file is constructed of the Front Matter section and the Slide Show section:
  • ---
    [](# "The Front Matter section")
    codeslide:
      ...
    
    ---
    [](# "The Slide Show section")
    # Slide 1
    ...
    
    ---
    # Slide 2
    ...
  1. Each slide is seperated with a horizontal line (--- in Markdown)
  2. Render Embedded Link in the Slide Show section with specific rules:
  • Link titled as :slide:
    • The resource is treated as a Markdown document
    • The text will be acquired by GET method
    • Rendered by the rules of the Slide Show section recursively
  • Link titled as :code:
    • The resource is treated as a plain text document
    • The text will be acquired by GET method
  • Link titled as :code.<language>:
    • The resource is treated as a code snippet of <language>
    • The text will be acquired by GET method
    • The code will be syntax-highlighted by Highlight.js
  • Link titled as :video or :video.<anything>:
    • The resource is treated as a HTML5 embedded video
    • The path or URL will be used as the value of src attribute
    • See CodeSlide CLI's README for learning to embed an HTML5 video for both GitHub and CodeSlide: GitHub | CodeSlide | Raw

Notes

  1. images and videos are treated as external resources, all of them are linked to HTML document
  2. If the output format is PDF, images will be included permanently in the document, while videos will show clickable camera icons with links

The schema of Front Matter section (YAML syntax)

  • The description and default value for each field
    codeslide:
      # [UNUSED] Compatible CodeSlide version
      version: 0.14.0
    
      # Options: html | pdf
      format: html
    
      # Options: ledger | legal | letter | tabloid | A0 | A1 | A2 | A3 | A4 | A5 | A6
      # Only allowed when format is pdf
      pageSize: A4
    
      # Options: landscape | portrait
      # Only allowed when format is pdf
      orientation: landscape
    
      # Sequence of paths or URLs for CSS
      # The default value will be overridden if set
      styles:
        - https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.8.0/styles/vs2015.min.css
    
      # Code snippets font
      codeFont:
        # CSS font-family property (string scalar)
        # The default value will be concatenated backwards
        family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace
    
        # The path or URL of CSS @font-face at-rule (string scalar)
        rule: ~
    
        # CSS font-size property (string scalar)
        # Better to use em unit for relative sizing
        size: smaller
    
        # CSS font-weight property (string scalar)
        weight: normal
    
      # Slides font
      slideFont:
        # CSS font-family property (string scalar)
        # Default values will be concatenated backwards
        family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace
    
        # The path or URL of CSS @font-face at-rule (string scalar)
        rule: ~
    
        # CSS font-size property (string scalar)
        # Better to use rem unit for absolute sizing
        size: large
    
        # CSS font-weight property (string scalar)
        weight: normal
  • All fields of codeslide (including itself) are optional
  • Redundant keys are all ignored

Customize the slideshow

Development

  • The built application:
    • is a Node.js application in IIFE format
    • is at ./dist/app.js after built
  • ./scripts/build.sh: Build production-level application
  • ./scripts/dev.sh: Build development-level application
  • ./scripts/clean.sh: Clean built application
  • ./scripts/example.sh: Build examples for the built application
  • ./scripts/publish.sh: Publish built application
  • To print bundle analysis with either ./scripts/build.sh or ./scripts/dev.sh, add option --analyze or --analyze=verbose (from esbuild)

Warning

esbuild skips type-checking and linting, which may cause unexpected errors in runtime. Use external tools for type-checking and linting.