Docusaurus has built-in support for MDX, which allows you to write JSX within your Markdown files and render them as React components.
.mdx files are parsed using MDX, some of the syntax are treated slightly differently. For the most accurate parsing and better editor support, we recommend using the
.mdx extension for files containing MDX syntax.
Try this block here:
Notice how it renders both the markup from your React component and the Markdown syntax:
I can write Markdown alongside my JSX!
You can also import your own components defined in other files or third-party components installed via npm! Check out the MDX docs to see what other fancy stuff you can do with MDX.
Since all doc files are parsed using MDX, any HTML is treated as JSX. Therefore, if you need to inline-style a component, follow JSX flavor and provide style objects. This behavior is different from Docusaurus 1. See also Migrating from v1 to v2.