/remark-highlight.js

Highlight code blocks in Markdown files with highlight.js.

Primary LanguageJavaScriptMIT LicenseMIT

remark-highlight.js Build Status NPM version Dependency Status

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.

Install

With npm do:

npm install remark-highlight.js --save

Example

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>

API

remark.use(hljs, [options])

options

For a list of languages that you can pass to these options, see the highlight.js documentation.

include

Type: array
Default: undefined

If this option is defined, this plugin will only highlight languages that are included in this array.

exclude

Type: array
Default: undefined

If this option is defined, this plugin will only highlight languages that are excluded from this array.

Contributing

Pull requests are welcome. If you add functionality, then please add unit tests to cover it.

License

MIT © Ben Briggs