Using MDX

Jun 1, 2024

This theme comes with the @astrojs/mdx integration installed and configured in your astro.config.mjs config file. If you prefer not to use MDX, you can disable support by removing the integration from your config file.

Why MDX?

MDX is a powerful way to write content in Markdown. It allows you to use JSX in your Markdown content, which means you can import and use React components, Vue components, or any other component.

MDX Features

With MDX, you can:

  • Write Markdown as usual
  • Import and use components
  • Use JSX expressions
  • Export metadata from files

Example

import MyComponent from './MyComponent';


# Hello World


This is **bold** and this is _italic_.


<MyComponent />
×