Marked instance
By default, Marked stores options and extensions in the global scope. That means changing the options in one script will also change the options in another script since they share the same instance.
If you don't want to mutate global scope, you can create a new instance of Marked to ensure options and extensions are locally scoped.
import { Marked } from 'marked';
const marked = new Marked([options, extension, ...]);
Argument | Type | Notes |
---|---|---|
options | object |
The same arguments that can be passed to marked.use |
The parse
function
import { marked } from 'marked';
marked.parse(markdownString [,options])
Argument | Type | Notes |
---|---|---|
markdownString | string |
String of markdown source to be compiled. |
options | object |
Hash of options. Can also use marked.use to set global options |
Alternative using reference
// Create reference instance
import { marked } from 'marked';
// Set options
marked.use({
async: true,
pedantic: false,
gfm: true,
});
// Compile
console.log(marked.parse(markdownString));
Options
Member | Type | Default | Since | Notes |
---|---|---|---|---|
async | boolean |
false |
4.1.0 | If true, walkTokens functions can be async and marked.parse will return a promise that resolves when all walk tokens functions resolve. |
breaks | boolean |
false |
v0.2.7 | If true, add <br> on a single line break (copies GitHub behavior on comments, but not on rendered markdown files). Requires gfm be true . |
gfm | boolean |
true |
v0.2.1 | If true, use approved GitHub Flavored Markdown (GFM) specification. |
pedantic | boolean |
false |
v0.2.1 | If true, conform to the original markdown.pl as much as possible. Don't fix original markdown bugs or behavior. Turns off and overrides gfm . |
renderer | object |
new Renderer() |
v0.3.0 | An object containing functions to render tokens to HTML. See extensibility for more details. |
silent | boolean |
false |
v0.2.7 | If true, the parser does not throw any exception or log any warning. Any error will be returned as a string. |
tokenizer | object |
new Tokenizer() |
v1.0.0 | An object containing functions to create tokens from markdown. See extensibility for more details. |
walkTokens | function |
null |
v1.1.0 | A function which is called for every token. See extensibility for more details. |
Old Options
Member | Type | Default | Since | Notes |
---|---|---|---|---|
baseUrl (removed) | string |
null |
v0.3.9 | Removed in v8.0.0 use marked-base-url to prefix url for any relative link. |
headerIds (removed) | boolean |
true |
v0.4.0 | Removed in v8.0.0 use marked-gfm-heading-id to include an id attribute when emitting headings (h1, h2, h3, etc). |
headerPrefix (removed) | string |
'' |
v0.3.0 | Removed in v8.0.0 use marked-gfm-heading-id to add a string to prefix the id attribute when emitting headings (h1, h2, h3, etc). |
highlight (removed) | function |
null |
v0.3.0 | Removed in v8.0.0 use marked-highlight to add highlighting to code blocks. |
langPrefix (removed) | string |
'language-' |
v0.3.0 | Removed in v8.0.0 use marked-highlight to prefix the className in a <code> block. Useful for syntax highlighting. |
mangle (removed) | boolean |
true |
v0.3.4 | Removed in v8.0.0 use marked-mangle to mangle email addresses. |
sanitize (removed) | boolean |
false |
v0.2.1 | Removed in v8.0.0 use a sanitize library, like DOMPurify (recommended), sanitize-html or insane on the output HTML! |
sanitizer (removed) | function |
null |
v0.3.4 | Removed in v8.0.0 use a sanitize library, like DOMPurify (recommended), sanitize-html or insane on the output HTML! |
smartypants (removed) | boolean |
false |
v0.2.9 | Removed in v8.0.0 use marked-smartypants to use "smart" typographic punctuation for things like quotes and dashes. |
xhtml (removed) | boolean |
false |
v0.3.2 | Removed in v8.0.0 use marked-xhtml to emit self-closing HTML tags for void elements (<br/>, <img/>, etc.) with a "/" as required by XHTML. |
Known Extensions
Marked can be extended using custom extensions. This is a list of extensions that can be used with marked.use(extension)
.
Name | Package Name | Description |
---|---|---|
Admonition | marked-admonition-extension |
Admonition extension |
Base URL | marked-base-url |
Prefix relative urls with a base URL. |
Bidi | marked-bidi |
Add Bidirectional text support to the HTML |
Code Format | marked-code-format |
Formatting code blocks using Prettier |
Code JSX Renderer | marked-code-jsx-renderer |
Render JSX code blocks using a custom renderer and components |
Code Preview | marked-code-preview |
Transform code blocks into code previews |
Custom Heading ID | marked-custom-heading-id |
Specify a custom heading id in headings with the Markdown Extended Syntax # heading {#custom-id} |
Emoji | marked-emoji |
Add emoji support like on GitHub |
Extended Tables | marked-extended-tables |
Extends the standard Github-Flavored tables to support advanced features: Column Spanning, Row Spanning, Multi-row headers |
GFM Heading ID | marked-gfm-heading-id |
Use github-slugger to create the heading IDs and allow a custom prefix. |
Highlight | marked-highlight |
Highlight code blocks |
Katex Code | marked-katex-extension |
Render katex code |
LinkifyIt | marked-linkify-it |
Use linkify-it for urls |
Mangle | marked-mangle |
Mangle mailto links with HTML character references |
Misskey-flavored Markdown | marked-mfm |
Custom extension for Misskey-flavored Markdown. |
Sequential Hooks | marked-sequential-hooks |
Enables the sequential preprocessing and post-processing within sequential hooks |
Smartypants | marked-smartypants |
Use smartypants to use "smart" typographic punctuation for things like quotes and dashes. |
Smartypants lite | marked-smartypants-lite |
A faster lighter version of marked-smartypants that doesn't use any external dependencies to create "smart" typographic punctuation for things like quotes and dashes. |
XHTML | marked-xhtml |
Emit self-closing HTML tags for void elements (<br/>, <img/>, etc.) with a "/" as required by XHTML. |
Inline Markdown
You can parse inline markdown by running markdown through marked.parseInline
.
const blockHtml = marked.parse('**strong** _em_');
console.log(blockHtml); // '<p><strong>strong</strong> <em>em</em></p>'
const inlineHtml = marked.parseInline('**strong** _em_');
console.log(inlineHtml); // '<strong>strong</strong> <em>em</em>'
Highlighting
Use marked-highlight
to highlight code blocks.
Workers
To prevent ReDoS attacks you can run marked on a worker and terminate it when parsing takes longer than usual.
Marked can be run in a worker thread on a node server, or a web worker in a browser.
Node Worker Thread
// markedWorker.js
import { marked } from 'marked';
import { parentPort } from 'worker_threads';
parentPort.on('message', (markdownString) => {
parentPort.postMessage(marked.parse(markdownString));
});
// index.js
import { Worker } from 'worker_threads';
const markedWorker = new Worker('./markedWorker.js');
const markedTimeout = setTimeout(() => {
markedWorker.terminate();
throw new Error('Marked took too long!');
}, timeoutLimit);
markedWorker.on('message', (html) => {
clearTimeout(markedTimeout);
console.log(html);
markedWorker.terminate();
});
markedWorker.postMessage(markdownString);
Web Worker
NOTE: Web Workers send the payload from
postMessage
in an object with the payload in a.data
property
// markedWorker.js
importScripts('path/to/marked.min.js');
onmessage = (e) => {
const markdownString = e.data
postMessage(marked.parse(markdownString));
};
// script.js
const markedWorker = new Worker('./markedWorker.js');
const markedTimeout = setTimeout(() => {
markedWorker.terminate();
throw new Error('Marked took too long!');
}, timeoutLimit);
markedWorker.onmessage = (e) => {
clearTimeout(markedTimeout);
const html = e.data;
console.log(html);
markedWorker.terminate();
};
markedWorker.postMessage(markdownString);
CLI Extensions
You can use extensions in the CLI by creating a new CLI that imports marked and the marked binary.
// file: myMarked
#!/usr/bin/node
import { marked } from 'marked';
import customHeadingId from 'marked-custom-heading-id';
marked.use(customHeadingId());
import 'marked/bin/marked';
$ ./myMarked -s "# heading {#custom-id}"
<h1 id="custom-id">heading</h1>