Skip to content
MDX logo
v1.6.5GitHub logoTwitter logo
GitHub logoTwitter logo

Markdown in Components

One great feature about MDX is that you can use Markdown within your JSX components.

Example

Lets say you wanted to create a custom <Note /> component. You could do something like this.

Using MDX 2:

CompileError: import is not supported (3:0)
1 : 
2 :     /* @jsx mdx */
3 : import Note from './Note'
    ^^^^^^^^^^^^^^^^^^^^^^^^^

The same example, using MDX 1 (notice the need blank lines between the tags and the content):

CompileError: import is not supported (3:0)
1 : 
2 :     /* @jsx mdx */
3 : import Note from './Note'
    ^^^^^^^^^^^^^^^^^^^^^^^^^
Edit this page on GitHub