remark-highlight.js
Highlight code blocks in Markdown files with highlight.js.
Note that since 4.x, the code is highlighted with lowlight which is a virtual DOM implementation of highlight.js.
This package integrates with remark-html. It may be better to work with rehype, which is specifically made for HTML, and to use rehype-highlight instead of this package.
With npm do:
npm install remark-highlight.js --save
remark-highlight.js is designed to work with remark-html:
Say example.md
looks as follows:
~~~css
h1 {
color: red;
}
~~~
...and example.js
like this:
var vfile = require('to-vfile');
var report = require('vfile-reporter');
var unified = require('unified');
var markdown = require('remark-parse');
var html = require('remark-html');
var highlight = require('remark-highlight.js');
unified()
.use(markdown)
.use(highlight)
.use(html)
.process(vfile.readSync('example.md'), function (err, file) {
console.error(report(err || file));
console.log(String(file));
});
Now, running node example
yields:
example.md: no issues found
<pre><code class="hljs language-css"><span class="hljs-selector-tag">h1</span> {
<span class="hljs-attribute">color</span>: red;
}</code></pre>
For a list of languages that you can pass to these options, see the highlight.js documentation.
Type: array
Default: undefined
If this option is defined, this plugin will only highlight languages that are included in this array.
Type: array
Default: undefined
If this option is defined, this plugin will only highlight languages that are excluded from this array.
Pull requests are welcome. If you add functionality, then please add unit tests to cover it.
MIT © Ben Briggs