MDX support (#3706)

* feat: first pass at MDX support

* fix: move built-in JSX renderer to come first

* chore: remove jsx example

* chore: update lockfile

* chore: cleanup example

* fix: missing deps

* refactor: move component render logic to `renderPage`

* chore: update HMR script

* chore: update MDX example

* refactor: prefer unshit

* refactor: remove TODO comment

* fix: remove duplicate identifier

* refactor: cleanup mdx entrypoint

* fix: better html handling

* fix: add tsconfig to mdx package

* chore: update lockfile

* fix: do not sort plugins unless mdx is enabled

* chore: update compiler

* fix(hmr): maybe render head for non-Astro pages

* fix: set initial pageExtensions

* refactor: cleanup addPageExtension

* refactor: remove addPageExtensions from types

* refactor: expose HookParameters type

* fix: only default to astro for MDX

* test: pick up jsx support in test fixtures

* refactor: simplify mdx entrypoint

* test: add basic MDX tests

* test(e2e): add mdx + framework tests

* chore: update lockfile

* test(e2e): fix preact mdx e2e test

* fix(mdx): disable .md support

* test(e2e): fix vue-component test missing mdx

* test(e2e): fix solid component needing import

* fix: allow `client:only="solid"` as an alias to `solid-js`

* chore: move to with-mdx example

* chore: update MDX readme

* chore: update example readme

* chore: bump astro version

* chore: update lockfile

* Update mod.d.ts

* feat: support `export const components` in MDX pages

* chore: update mdx example

* fix: update jsx-runtime with better slot support

* refactor: remove object style support

* chore: cleanup package exports

* chore: add todo comment

* refactor: improve isPage function, move to utils

* refactor: dry up manual HMR updates

* chore: add dev tests for MDX

* chore: prefer set to array

* chore: add changesets

* fix(hmr): flip public/private route

Co-authored-by: Nate Moore <nate@astro.build>

1 files changed, 39 insertions, 0 deletions

diff --git a/packages/integrations/mdx/src/index.ts b/packages/integrations/mdx/src/index.ts
new file mode 100644
index 000000000..d07913ede
--- /dev/null
+++ b/packages/integrations/mdx/src/index.ts
@@ -0,0 +1,39 @@
+import type { AstroIntegration } from 'astro';
+import mdxPlugin from '@mdx-js/rollup';
+
+export default function mdx(): AstroIntegration {
+	return {
+			name: '@astrojs/mdx',
+			hooks: {
+				'astro:config:setup': ({ updateConfig, addPageExtension, command }: any) => {
+					addPageExtension('.mdx');
+					updateConfig({
+						vite: {
+							plugins: [
+								{ 	
+									enforce: 'pre',
+									...mdxPlugin({
+										jsx: true,
+										jsxImportSource: 'astro',
+										// Note: disable `.md` support
+										format: 'mdx',
+										mdExtensions: []
+									})
+								},
+								command === 'dev' && {
+									name: '@astrojs/mdx',
+									transform(code: string, id: string) {
+										if (!id.endsWith('.mdx')) return;
+										// TODO: decline HMR updates until we have a stable approach
+										return `${code}\nif (import.meta.hot) {
+											import.meta.hot.decline();
+										}`
+									}
+								}
+							]
+						}
+					})
+				}
+			}
+		}
+}