2 files changed, 27 insertions, 11 deletions
diff --git a/packages/integrations/markdoc/src/extensions/prism.ts b/packages/integrations/markdoc/src/extensions/prism.ts
new file mode 100644
index 000000000..e28112c9a
--- /dev/null
+++ b/packages/integrations/markdoc/src/extensions/prism.ts
@@ -0,0 +1,24 @@
+// leave space, so organize imports doesn't mess up comments
+// @ts-expect-error Cannot find module 'astro/runtime/server/index.js' or its corresponding type declarations.
+import { unescapeHTML } from 'astro/runtime/server/index.js';
+
+import { runHighlighterWithAstro } from '@astrojs/prism/dist/highlighter';
+import { Markdoc, type AstroMarkdocConfig } from '../config.js';
+
+export default function prism(): AstroMarkdocConfig {
+	return {
+		nodes: {
+			fence: {
+				attributes: Markdoc.nodes.fence.attributes!,
+				transform({ attributes: { language, content } }) {
+					const { html, classLanguage } = runHighlighterWithAstro(language, content);
+
+					// Use `unescapeHTML` to return `HTMLString` for Astro renderer to inline as HTML
+					return unescapeHTML(
+						`<pre class="${classLanguage}"><code class="${classLanguage}">${html}</code></pre>`
+					);
+				},
+			},
+		},
+	};
+}
diff --git a/packages/integrations/markdoc/src/extensions/shiki.ts b/packages/integrations/markdoc/src/extensions/shiki.ts
index d03a60139..491deed56 100644
--- a/packages/integrations/markdoc/src/extensions/shiki.ts
+++ b/packages/integrations/markdoc/src/extensions/shiki.ts
@@ -2,11 +2,11 @@
 // @ts-expect-error Cannot find module 'astro/runtime/server/index.js' or its corresponding type declarations.
 import { unescapeHTML } from 'astro/runtime/server/index.js';
 
-import Markdoc from '@markdoc/markdoc';
 import type { ShikiConfig } from 'astro';
 import type * as shikiTypes from 'shiki';
 import type { AstroMarkdocConfig } from '../config.js';
-import { MarkdocError } from '../utils.js';
+import Markdoc from '@markdoc/markdoc';
+import { getHighlighter } from 'shiki';
 
 // Map of old theme names to new names to preserve compatibility when we upgrade shiki
 const compatThemes: Record<string, string> = {
@@ -51,19 +51,11 @@ const INLINE_STYLE_SELECTOR = /style="(.*?)"/;
  */
 const highlighterCache = new Map<string, shikiTypes.Highlighter>();
 
-export async function shiki({
+export default async function shiki({
 	langs = [],
 	theme = 'github-dark',
 	wrap = false,
 }: ShikiConfig = {}): Promise<AstroMarkdocConfig> {
-	let getHighlighter: (options: shikiTypes.HighlighterOptions) => Promise<shikiTypes.Highlighter>;
-	try {
-		getHighlighter = (await import('shiki')).getHighlighter;
-	} catch {
-		throw new MarkdocError({
-			message: 'Shiki is not installed. Run `npm install shiki` to use the `shiki` extension.',
-		});
-	}
 	theme = normalizeTheme(theme);
 
 	const cacheID: string = typeof theme === 'string' ? theme : theme.name;