Skip to content
🎉MDX Conf — August 24th, 2020
MDX logo
v1.6.18

Create React App

Please note there’s a known bug with the macro so live reloading doesn’t currently work.

With Create React App you will need to use mdx.macro.

npx create-react-app my-app
yarn add mdx.macro

Then create the following src/App.js:

// src/App.js
import React, {lazy, Component, Suspense} from 'react'
import {importMDX} from 'mdx.macro'
const Content = lazy(() => importMDX('./Content.mdx'))
class App extends Component {
render() {
return (
<div>
<Suspense fallback={<div>Loading...</div>}>
<Content />
</Suspense>
</div>
)
}
}
export default App

And then create the following src/Content.mdx:

# Hello, world!

See the full example

Edit this page on GitHub
Previous:
Gatsby
Next:
React Static