Built-in MDX#

A copy-paste Vite app lives at examples/mdx in the repository.

This example does not set mdx: true. .mdx files parse JSX, ESM, and {expression} by default. A sibling .md file stays CommonMark + GFM.

Run it#

Tab 1Tab 2Tab 3Tab 4Tab 5

vp run --filter ./examples/mdx dev
vp run --filter ./examples/mdx typecheck
vp run --filter ./examples/mdx build

pnpm --filter ./examples/mdx dev
pnpm --filter ./examples/mdx typecheck
pnpm --filter ./examples/mdx build

bun --filter ./examples/mdx dev
bun --filter ./examples/mdx typecheck
bun --filter ./examples/mdx build

npm --workspace ./examples/mdx run dev
npm --workspace ./examples/mdx run typecheck
npm --workspace ./examples/mdx run build

yarn workspace ox-content-mdx-example dev
yarn workspace ox-content-mdx-example typecheck
yarn workspace ox-content-mdx-example build

Tab 1

vp run --filter ./examples/mdx dev
vp run --filter ./examples/mdx typecheck
vp run --filter ./examples/mdx build

Tab 2

pnpm --filter ./examples/mdx dev
pnpm --filter ./examples/mdx typecheck
pnpm --filter ./examples/mdx build

Tab 3

bun --filter ./examples/mdx dev
bun --filter ./examples/mdx typecheck
bun --filter ./examples/mdx build

Tab 4

npm --workspace ./examples/mdx run dev
npm --workspace ./examples/mdx run typecheck
npm --workspace ./examples/mdx run build

Tab 5

yarn workspace ox-content-mdx-example dev
yarn workspace ox-content-mdx-example typecheck
yarn workspace ox-content-mdx-example build

What the pages show#

File	Shows
`src/content/index.mdx`	Lowercase tags as static HTML, PascalCase `data-ox-island`, ESM omitted, `{expression}` not evaluated
`src/content/islands.mdx`	Static HTML vs island placeholders without a framework plugin
`src/content/plain.md`	Sibling `.md` that does not parse JSX

There is no React / Vue / Svelte / Solid plugin. Named components stay data-ox-island placeholders. import / export do not appear in the HTML and are not executed.

See MDX & Components for the language reference.