remark-rehype

What is remark-rehype?

The remark-rehype npm package is a plugin that transforms Markdown (.md) files into HTML. It is part of the unified ecosystem and is commonly used to integrate with other unified plugins to process and manipulate content.

What are remark-rehype's main functionalities?

Markdown to HTML conversion

This feature allows you to convert Markdown content into HTML. The code sample demonstrates how to set up a unified processor that parses Markdown, converts it to HTML using remark-rehype, and then serializes it to a string.

const unified = require('unified');
const markdown = require('remark-parse');
const remark2rehype = require('remark-rehype');
const html = require('rehype-stringify');

unified()
  .use(markdown)
  .use(remark2rehype)
  .use(html)
  .process('# Hello world!', function (err, file) {
    if (err) throw err;
    console.log(String(file));
  });

Integration with unified ecosystem

remark-rehype can be used in conjunction with other plugins in the unified ecosystem, such as rehype-format for formatting the resulting HTML. The code sample shows how to include the rehype-format plugin in the processing pipeline.

const unified = require('unified');
const markdown = require('remark-parse');
const remark2rehype = require('remark-rehype');
const rehypeFormat = require('rehype-format');
const html = require('rehype-stringify');

unified()
  .use(markdown)
  .use(remark2rehype)
  .use(rehypeFormat)
  .use(html)
  .process('# Hello world!', function (err, file) {
    if (err) throw err;
    console.log(String(file));
  });

Other packages similar to remark-rehype

remark-html

remark-html is a remark plugin to compile Markdown to HTML. It is similar to remark-rehype but does not use the rehype ecosystem, which means it has less flexibility in terms of further HTML manipulations.

showdown

Showdown is a JavaScript Markdown to HTML converter, which can be used on both the server and in the browser. Unlike remark-rehype, it is not part of the unified ecosystem and operates as a standalone converter.

README

remark-rehype

Bridge / mutate from remark to rehype.

Installation

npm:

npm install remark-rehype

Usage

var unified = require('unified');
var parse = require('remark-parse');
var remark2rehype = require('remark-rehype');
var highlight = require('rehype-highlight');
var stringify = require('rehype-stringify');
var report = require('vfile-reporter');

unified()
  .use(parse)
  .use(remark2rehype)
  .use(highlight)
  .use(stringify)
  .process([
    '## Hello, world!',
    '',
    '    "use strict"',
    '    var name = "World";',
    '    console.log("Hello, " + name + "!");',
    ''
  ].join('\n'), function (err, file) {
    console.error(report(err || file));
    console.log(String(file));
  });

stderr(4) yields:

no issues found

stdout(4) yields:

<h2>Hello, world!</h2>
<pre><code class="hljs language-javascript"><span class="hljs-meta">"use strict"</span>
<span class="hljs-keyword">var</span> name = <span class="hljs-string">"World"</span>;
<span class="hljs-built_in">console</span>.log(<span class="hljs-string">"Hello, "</span> + name + <span class="hljs-string">"!"</span>);
</code></pre>

API

origin.use(remark2rehype[, destination])

Either bridge or mutate from remark (MDAST) to rehype (HAST).

destination

If given (Unified), runs the destination processor with the new HAST tree, then, after running discards that tree and continues on running the origin processor with the original tree (bridge-mode). Otherwise, passes the tree to further plug-ins (mutate-mode).

License

MIT © Titus Wormer