markdown-it-prism Build Status npm version Bower version
markdown-it plugin to highlight code blocks using Prism
const md = require('markdown-it')(); const prism = require('markdown-it-prism'); md.use(prism, options);
The plugin will insert the necessary markup into all code blocks. Include one of Prism’s stylesheets in your HTML to get highlighted code.
The options object may contain:
| Name | Description | Default |
|---|---|---|
highlightInlineCode |
Whether to highlight inline code. | false |
plugins |
Array of Prism Plugins to load. The names to use can be found here. Please note that some prism plugins (notably line-numbers) rely on the DOM being present and can thus not be used with this package (see #1). | [] |
init |
A function called after setting up prism. Will receive the prism instance as only argument. Useful for plugins needing further intialisation. | () => {} |
defaultLanguageForUnknown |
The language to use for code blocks that specify a language that Prism does not know. No default will be used if this option is undefined. |
undefined |
defaultLanguageForUnspecified |
The language to use for code block that do not specify a language. No default will be used if this option is undefined. |
undefined |
defaultLanguage |
Shorthand to set both defaultLanguageForUnknown and defaultLanguageForUnspecified to the same value. |
undefined |
When highlightInlineCode is set, inline code will be highlighted just like fenced code blocks are.
To specifiy the language of inline code, add {language=<your-language>} after the code segment:
`class Demo { };`{language=cpp}
This syntax is compatible with markdown-it-attrs:
The language=<x> part will be stripped, but everything else between { and } will work
with markdown-it-attrs as usual.
If you want to use this plugin together with Webpack, you need to import all languages you intend to use:
import MarkdownIt from 'markdown-it'; import prism from 'markdown-it-prism'; import "prismjs/components/prism-clike" import "prismjs/components/prism-java" function component() { const md = new MarkdownIt(); md.use(prism); const element = document.createElement('div'); element.innerHTML = md.render(` Here is some *code*: \`\`\`java public class Test { public void foo() {} } \`\`\` `); return element; } document.body.appendChild(component());
Beware: Prisms languages have dependencies onto each other. You need to import the languages together with their dependencies in the correct order.