Class: Marpit

Constructor#

new Marpit(optsopt)#

Create a Marpit instance.

Parameters:

Name Type Attributes Description

opts

Object

Properties

Name	Type	Attributes	Default	Description
`anchor`	boolean \| Marpit~AnchorCallback	<optional>	true	Set the page number as anchor of each slides (`id` attribute). You can customize the anchor text by defining a custom callback function.
`container`	false \| Element \| Array.<Element>	<optional>	module:element.marpitContainer	Container element(s) wrapping whole slide deck.
`cssContainerQuery`	boolean \| string \| Array.<string>	<optional>	false	Set whether to enable CSS container query (`@container`). By setting the string or string array, you can specify the container name(s) for the CSS container.
`cssNesting`	boolean	<optional>	false	Enable CSS nesting support. If enabled, Marpit will try to make flatten the CSS with nested rules before rendering, to make it compatible with Marpit preprocessings.
`headingDivider`	false \| number \| Array.<number>	<optional>	false	Start a new slide page at before of headings. it would apply to headings whose larger than or equal to the specified level if a number is given, or ONLY specified levels if a number array.
`lang`	string	<optional>		Set the default `lang` attribute of each slide. It can override by `lang` global directive in the Markdown.
`looseYAML`	boolean	<optional>	false	Allow loose YAML parsing in built-in directives, and custom directives defined in current instance.
`markdown`	MarkdownIt \| string \| Object \| Array	<optional>		An instance of markdown-it or its constructor option(s) for wrapping. Marpit will create its instance based on CommonMark when omitted.
`printable`	boolean	<optional>	true	Make style printable to PDF.
`slideContainer`	false \| Element \| Array.<Element>	<optional>		Container element(s) wrapping each slide sections.
`inlineSVG`	boolean \| Marpit~InlineSVGOptions	<optional>	false	Wrap each slide sections by inline SVG. (Experimental)

Source: marpit.js, line 44

Members#

(readonly) customDirectives :Object#

Definitions of the custom directive.

It has the assignable global and local object. They have consisted of the directive name as a key, and parser function as a value. The parser should return the validated object for updating meta of markdown-it token.

Type:

Object

Source: marpit.js, line 113

markdown :MarkdownIt#

Type:

MarkdownIt

Source: marpit.js, line 161

(readonly) options :Object#

The current options for this instance.

This property is read-only and marked as immutable. You cannot change the value of options after creating instance.

Type:

Object

Source: marpit.js, line 98

themeSet :ThemeSet#

Type:

ThemeSet

Source: marpit.js, line 135

Methods#

render(markdown, envopt) → {Marpit~RenderResult}#

Render Markdown into HTML and CSS string.

Parameters:

Name Type Attributes Default Description

markdown

string

A Markdown string.

env

Object

{}

Environment object for passing to markdown-it.

Properties

Name	Type	Attributes	Default	Description
`htmlAsArray`	boolean	<optional>	false	Output rendered HTML as array per slide.

Source: marpit.js, line 222

Returns:

An object of rendering result.

Type:: Marpit~RenderResult

use(plugin, …params) → {Marpit}#

Load plugin either markdown-it or PostCSS into the current Marpit instance.

Parameters:

Name	Type	Attributes	Description
`plugin`	function		A markdown-it plugin or PostCSS plugin.
`params`	*	<repeatable>	Params to pass into markdown-it plugin. (Not used in PostCSS plugin)

Source: marpit.js, line 302

Returns:

The called Marpit instance for chainable.

Type:: Marpit

Type Definitions#

AnchorCallback(index) → {string}#

Convert slide page index into anchor string.

Parameters:

Name	Type	Description
`index`	number	Slide page index, beginning from zero.

Source: marpit.js, line 55

Returns:

The text of anchor for id attribute, without prefix #.

Type:: string

InlineSVGOptions#

Type:

Object

Properties

Name	Type	Attributes	Default	Description
`enabled`	boolean	<optional>	true	Whether inline SVG mode is enabled.
`backdropSelector`	boolean	<optional>	true	Whether `::backdrop` selector support is enabled. If enabled, the `::backdrop` CSS selector will match to the SVG container element.

Source: marpit.js, line 47

RenderResult#

Type:

Object

Properties

Name	Type	Description
`html`	string \| Array.<string>	Rendered HTML.
`css`	string	Rendered CSS.
`comments`	Array.<Array.<string>>	Parsed HTML comments per slide pages, excepted YAML for directives. It would be useful for presenter notes.

Source: marpit.js, line 205