Merge pull request #1 from marp-team/ready-script

Add Marp.ready() script to exported HTML

CHANGELOG.md

@@ -2,6 +2,16 @@
 
 ## [Unreleased]
 
+### Added
+
+- Support Marp core's fitting header by including browser bundle to exported PDF ([#1](https://github.com/marp-team/marp-cli/pull/1))
+- Add tests to fill global minimum coverage
+
+### Removed
+
+- Make a sweep much advanced CLI options: `--engine`, `--engine-name`.\
+  _These options will become to be configurable by JavaScript conf file in future._
+
 ## v0.0.2 - 2018-08-21
 
 - Initial release. _Please notice that it is early alpha release._

README.md

@@ -54,8 +54,8 @@ Under construction.
 - [x] Select theme by option
 - [ ] Support configuration file (like `.marprc`)
 - [ ] Watch mode
-- [ ] HTML templates
-  - User can choice the base template, such as HTML that is ready to actual presentation.
+- [x] HTML templates
+  - [ ] Template that has ready to actual presentation powered by [Bespoke](https://github.com/bespokejs/bespoke)
 - [ ] Select engine to use any Marpit based module
 - [ ] Export PDF directly by using [Puppetter](https://github.com/GoogleChrome/puppeteer)
 

package.json

@@ -79,7 +79,7 @@
     "uglify-es": "^3.3.9"
   },
   "dependencies": {
-    "@marp-team/marp-core": "^0.0.2",
+    "@marp-team/marp-core": "^0.0.3",
     "@marp-team/marpit": "^0.0.12",
     "chalk": "^2.4.1",
     "globby": "^8.0.1",

src/converter.ts

@@ -1,15 +1,14 @@
-import { MarpOptions } from '@marp-team/marp-core'
 import { Marpit, MarpitRenderResult, MarpitOptions } from '@marp-team/marpit'
 import fs from 'fs'
 import path from 'path'
-import { CLIError, error } from './error'
+import { error } from './error'
 import templates from './templates'
 
 export interface ConverterOption {
-  engine: MarpitEngine | string
-  engineName: string
-  options: MarpOptions | MarpitOptions
+  engine: typeof Marpit
+  options: MarpitOptions
   output?: string
+  readyScript?: string
   template: string
   theme?: string
 }
@@ -21,32 +20,11 @@ export interface ConvertResult {
   result: string
 }
 
-type MarpitEngine = new (opts?: MarpitOptions) => Marpit
-
 export class Converter {
-  readonly engine!: MarpitEngine
   readonly options: ConverterOption
 
   constructor(opts: ConverterOption) {
     this.options = opts
-
-    try {
-      this.engine =
-        typeof opts.engine === 'string'
-          ? <MarpitEngine>require(opts.engine)[opts.engineName]
-          : opts.engine
-    } catch (err) {
-      if (err instanceof CLIError) throw err
-      error(`Failed to resolve engine. (${err.message})`)
-    }
-  }
-
-  get renderer() {
-    const renderer = new this.engine(this.options.options)
-    if (!(renderer instanceof Marpit))
-      error('Specified engine has not extended from Marpit framework.')
-
-    return renderer
   }
 
   get template() {
@@ -57,15 +35,15 @@ export class Converter {
   }
 
   convert(markdown: string) {
-    const { options, theme } = this.options
-
     let additionals = ''
-    if (theme) additionals += `\n<!-- theme: ${JSON.stringify(theme)} -->`
+
+    if (this.options.theme)
+      additionals += `\n<!-- theme: ${JSON.stringify(this.options.theme)} -->`
 
     return this.template({
-      options,
-      markdown: `${markdown}${additionals}`,
-      engine: this.engine,
+      readyScript: this.options.readyScript,
+      renderer: tplOpts =>
+        this.generateEngine(tplOpts).render(`${markdown}${additionals}`),
     })
   }
 
@@ -98,6 +76,18 @@ export class Converter {
     return Promise.all(files.map(fn => this.convertFile(fn)))
   }
 
+  private generateEngine(mergeOptions: MarpitOptions) {
+    const engine = new this.options.engine({
+      ...this.options.options,
+      ...mergeOptions,
+    })
+
+    if (typeof engine.render !== 'function')
+      error('Specified engine has not implemented render() method.')
+
+    return engine
+  }
+
   private outputPath(from: string, extension = 'html'): string {
     if (this.options.output) return this.options.output
 

src/marp-cli.ts

@@ -7,6 +7,7 @@ import yargs from 'yargs/yargs'
 import * as cli from './cli'
 import { Converter } from './converter'
 import { CLIError, error } from './error'
+import { MarpReadyScript } from './ready'
 import templates from './templates'
 import { name, version } from '../package.json'
 
@@ -46,16 +47,6 @@ export default async function(argv: string[] = []): Promise<number> {
           group: OptionGroup.Basic,
           type: 'string',
         },
-        engine: {
-          describe: 'Engine module to conversion',
-          group: OptionGroup.Converter,
-          type: 'string',
-        },
-        'engine-name': {
-          describe: "Engine module's exported name",
-          group: OptionGroup.Converter,
-          type: 'string',
-        },
         template: {
           describe: 'Template name',
           group: OptionGroup.Converter,
@@ -76,11 +67,12 @@ export default async function(argv: string[] = []): Promise<number> {
       return 0
     }
 
+    // Initialize converter
     const converter = new Converter({
-      engine: args.engine || Marp,
-      engineName: args.engineName || 'default',
+      engine: Marp,
       options: {},
       output: args.output,
+      readyScript: await MarpReadyScript.bundled(),
       template: args.template || 'bare',
       theme: args.theme,
     })
@@ -96,7 +88,7 @@ export default async function(argv: string[] = []): Promise<number> {
         cli.warn('Not found processable Markdown file(s).\n')
 
       program.showHelp()
-      return 0
+      return args._.length > 0 ? 1 : 0
     }
 
     const plural = files.length > 1 ? 's' : ''

src/ready.ts

@@ -0,0 +1,24 @@
+import { marpBrowser } from '@marp-team/marp-core/package.json'
+import fs from 'fs'
+import path from 'path'
+
+export type ReadyScriptResolver = () => Promise<string>
+
+export class MarpReadyScript {
+  static bundled: ReadyScriptResolver = async () => {
+    const bundlePath = path.resolve(
+      __dirname,
+      '../node_modules/@marp-team/marp-core/',
+      marpBrowser
+    )
+
+    const bundleJS = await new Promise<Buffer>((resolve, reject) =>
+      fs.readFile(bundlePath, (e, data) => (e ? reject(e) : resolve(data)))
+    )
+
+    return `<script defer>${bundleJS.toString()}</script>`
+  }
+
+  static cdn: ReadyScriptResolver = async () =>
+    `<script defer src="https://cdn.jsdelivr.net/npm/@marp-team/marp-core/${marpBrowser}"></script>`
+}

src/templates.ts

@@ -1,11 +1,10 @@
 import barePug from './templates/bare.pug'
 import bareScss from './templates/bare.scss'
-import { Marpit, MarpitOptions, MarpitRenderResult } from '@marp-team/marpit'
+import { MarpitOptions, MarpitRenderResult } from '@marp-team/marpit'
 
 export interface TemplateOptions {
-  engine: new (opts?: MarpitOptions) => Marpit
-  markdown: string
-  options: MarpitOptions
+  readyScript?: string
+  renderer: (tplOpts: MarpitOptions) => MarpitRenderResult
   [prop: string]: any
 }
 
@@ -17,18 +16,11 @@ export interface TemplateResult {
 
 export type Template = (locals: TemplateOptions) => TemplateResult
 
-const render = (locals: TemplateOptions) =>
-  new locals.engine(locals.options).render(locals.markdown)
-
 export const bare: Template = opts => {
-  const rendered = render({
-    ...opts,
-    options: {
-      ...opts.options,
-      container: [],
-      inlineSVG: true,
-      slideContainer: [],
-    },
+  const rendered = opts.renderer({
+    container: [],
+    inlineSVG: true,
+    slideContainer: [],
   })
 
   const result = barePug({

src/templates/bare.pug

@@ -1,8 +1,11 @@
+<!DOCTYPE html>
 html(lang="en")
   head
     meta(charset="UTF-8")
     meta(name="viewport", content="width=device-width, initial-scale=1.0")
     meta(http-equiv="X-UA-Compatible", content="ie=edge")
     style!= bare.css
     style!= css
-  body!= html
+  body
+    != html
+    != readyScript

test/_files/1.md

@@ -0,0 +1 @@
+# one

test/_files/2.mdown

@@ -0,0 +1 @@
+## two

test/_files/3.markdown

@@ -0,0 +1 @@
+### three

test/_files/4.txt

@@ -0,0 +1 @@
+#### four

test/_files/subfolder/5.md

@@ -0,0 +1 @@
+##### five