Using MDX

This theme comes with the @astrojs/mdx (external link) 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 special flavor of Markdown that supports embedded JavaScript & JSX syntax. This unlocks the ability to mix JavaScript and UI Components into your Markdown content (external link) for things like interactive charts or alerts.

If you have existing content authored in MDX, this integration will hopefully make migrating to Astro a breeze.

Example

Here is an Astro component embedded in MDX with client-side behavior:

More Links

• MDX Syntax Documentation (external link)
• Astro Usage Documentation (external link)
• Note: Client Directives (external link) are required for framework components. Astro components can include explicit <script> blocks for progressive enhancement.

Share Link copied