  Guides

Getting Started Search Ct rl+ K

Getting Started 

ReadMe's Markdown engine, with notes of GitHub, modern styles, and a

hint of magic.

A remark-based Markdown engine for parsing and rendering ReadMe docs. (In fact, CI passing
you're looking at it right now, since we've used it to render every doc in this project!)

Bash

npm install --save @readme/markdown

🧙 ‍Backwards Compatible

Our old engine was based on a format we call "magic blocks". This was our custom, JSON-based
syntax for writing rich components alongside plain-text Markdown. To provide seamless
backwards-compatibility, the engine ships with a built-in parser for the older format so we can
transpile it directly to our new ReadMe-flavored syntax.

Usage
By default, the Markdown library exports a function which takes a string of ReadMe-flavored
markdown and returns a tree of React components:

Component

import React from 'react';

import rdmd from '@readme/markdown';

export default ({ body }) => (

<div className="markdown-body">
{rdmd(body)}
</div>
);
Exports
Transformers
In addition to the default React processor, the package exports a few other methods for parsing and
rendering ReadMe-flavored markdown:

JavaScript

import * as rdmd from '@readme/markdown';

This gives you various methods and utilities:

Export Description Arguments

react default; returns a VDOM React tree text , options

html transform markdown in to HTML text , options

ast transform markdown to an mdast object text , options

md transform mdast in to ReadMe-flavored markdown ast , options

Utilities
The utils export gives you access to various tools and configuration settings:

options
a hash of default settings accepted by the rdmd engine.
markdownOptions —configuration object passed to remark

correctnewlines —flag to toggle newline transformation.

normalize —auto-normalize magic blocks before processing.

disableTokenizers —disable internal block or inline tokenizers.

<GlossaryContext/> and <VariablesContext/>

React provider and consumer wrappers for user data injection.

 Updated 3 months ago

Flavored Syntax 
Did this page help you?  Yes  No