ReadMe's MDX rendering engine and custom component collection.
  (Use ReadMe? Learn more about our upcoming move to MDX!)

To use the engine, install it from NPM:

npm install --save @readme/markdown

Then compile and run your MDX:

import RMDX from '@readme/markdown';

export default ({ body }) => (
  <div className="markdown-body">
    {RMDX.run(RMDX.compile(body))}
  </div>
);

Compiles MDX to JS. Essentially a wrapper around mdx.compile. Used before calling run; it has been left as a seperate method for potential caching opportunities.

• string (string)—an MDX document
• opts (CompileOpts, optional)—a configuration object

A string of compiled Javascript module code.

Compiles an AST to a string of MDX syntax.

• tree (object)—an abstract syntax tree
• opts (Options)—remark-stringify configuration.

An MDX string.

• mdast: parse MDX syntax to MDAST.
• hast: parse MDX syntax to HAST.
• plain: parse MDX to a plaintext string with all Markdown syntax removed. (This does not eval the doc.)
• tags: get a list of tag names from the doc. (This does not eval the doc.)
• utils: additional defaults, helper methods, components, and so on.

Extends CompileOptions

• lazyImages (boolean, optional)—load images lazily
• safeMode (boolean, optional)—extract script tags from HTMLBlocks
• components (Record<string, string>, optional)—an object of tag names to mdx.
• copyButtons (Boolean, optional) — add a copy button to code blocks

Extends RunOptions

• components (Record<string, MDXModule>, optional)—a set of custom MDX components
• imports (Record<string, unknown>, optional)—an set of modules to import globally
• terms (GlossaryTerm[], optional)
• variables (Variables, optional)—an object containing user variables

• default (() => MDXContent)—the MDX douments default export
• toc (HastHeading[])—a list of headings in the document
• Toc (() => MDCContent)—a table of contents component

To make changes to the RDMD engine locally, run the local development server. Clone the repo, cd in to it, npm install, and npm run start!

If you make changes to the docs or how the markdown is rendered, you may need to update the visual regression snapshots by running make updateSnapshot. Running these browser tests requires docker. Follow the docker install instructions for mac. You may want to increase the memory usage. If you have not already, you'll need to create an account for docker hub and sign-in locally.