summaryrefslogtreecommitdiff
path: root/packages/integrations
diff options
context:
space:
mode:
Diffstat (limited to 'packages/integrations')
-rw-r--r--packages/integrations/mdx/src/index.ts15
-rw-r--r--packages/integrations/mdx/src/remark-prism.ts23
-rw-r--r--packages/integrations/mdx/test/mdx-syntax-highlighting.test.js12
3 files changed, 24 insertions, 26 deletions
diff --git a/packages/integrations/mdx/src/index.ts b/packages/integrations/mdx/src/index.ts
index 2ac6cc66a..b33b09886 100644
--- a/packages/integrations/mdx/src/index.ts
+++ b/packages/integrations/mdx/src/index.ts
@@ -1,13 +1,13 @@
-import type { RemarkMdxFrontmatterOptions } from 'remark-mdx-frontmatter';
-import type { AstroIntegration } from 'astro';
-import remarkShikiTwoslash from 'remark-shiki-twoslash';
import { nodeTypes } from '@mdx-js/mdx';
-import rehypeRaw from 'rehype-raw';
import mdxPlugin, { Options as MdxRollupPluginOptions } from '@mdx-js/rollup';
+import type { AstroIntegration } from 'astro';
import { parse as parseESM } from 'es-module-lexer';
+import rehypeRaw from 'rehype-raw';
import remarkFrontmatter from 'remark-frontmatter';
import remarkGfm from 'remark-gfm';
+import type { RemarkMdxFrontmatterOptions } from 'remark-mdx-frontmatter';
import remarkMdxFrontmatter from 'remark-mdx-frontmatter';
+import remarkShikiTwoslash from 'remark-shiki-twoslash';
import remarkSmartypants from 'remark-smartypants';
import remarkPrism from './remark-prism.js';
import { getFileInfo } from './utils.js';
@@ -27,10 +27,7 @@ type MdxOptions = {
const DEFAULT_REMARK_PLUGINS = [remarkGfm, remarkSmartypants];
-function handleExtends<T>(
- config: WithExtends<T[] | undefined>,
- defaults: T[] = [],
-): T[] {
+function handleExtends<T>(config: WithExtends<T[] | undefined>, defaults: T[] = []): T[] {
if (Array.isArray(config)) return config;
return [...defaults, ...(config?.extends ?? [])];
@@ -56,7 +53,7 @@ export default function mdx(mdxOptions: MdxOptions = {}): AstroIntegration {
]);
rehypePlugins.push([rehypeRaw, { passThrough: nodeTypes }]);
}
-
+
if (config.markdown.syntaxHighlight === 'prism') {
remarkPlugins.push(remarkPrism);
rehypePlugins.push([rehypeRaw, { passThrough: nodeTypes }]);
diff --git a/packages/integrations/mdx/src/remark-prism.ts b/packages/integrations/mdx/src/remark-prism.ts
index 019c3984b..4a324dd1d 100644
--- a/packages/integrations/mdx/src/remark-prism.ts
+++ b/packages/integrations/mdx/src/remark-prism.ts
@@ -45,15 +45,16 @@ function runHighlighter(lang: string, code: string) {
/** */
export default function remarkPrism() {
- return (tree: any) => visit(tree, 'code', (node: any) => {
- let { lang, value } = node;
- node.type = 'html';
-
- let { html, classLanguage } = runHighlighter(lang, value);
- let classes = [classLanguage];
- node.value = `<pre class="${classes.join(
- ' '
- )}"><code class="${classLanguage}">${html}</code></pre>`;
- return node;
- });
+ return (tree: any) =>
+ visit(tree, 'code', (node: any) => {
+ let { lang, value } = node;
+ node.type = 'html';
+
+ let { html, classLanguage } = runHighlighter(lang, value);
+ let classes = [classLanguage];
+ node.value = `<pre class="${classes.join(
+ ' '
+ )}"><code class="${classLanguage}">${html}</code></pre>`;
+ return node;
+ });
}
diff --git a/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js b/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js
index d2bbb9266..5544aef56 100644
--- a/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js
+++ b/packages/integrations/mdx/test/mdx-syntax-highlighting.test.js
@@ -17,10 +17,10 @@ describe('MDX syntax highlighting', () => {
integrations: [mdx()],
});
await fixture.build();
-
+
const html = await fixture.readFile('/index.html');
const { document } = parseHTML(html);
-
+
const shikiCodeBlock = document.querySelector('pre.shiki');
expect(shikiCodeBlock).to.not.be.null;
});
@@ -37,10 +37,10 @@ describe('MDX syntax highlighting', () => {
integrations: [mdx()],
});
await fixture.build();
-
+
const html = await fixture.readFile('/index.html');
const { document } = parseHTML(html);
-
+
const shikiCodeBlock = document.querySelector('pre.shiki.dracula');
expect(shikiCodeBlock).to.not.be.null;
});
@@ -56,10 +56,10 @@ describe('MDX syntax highlighting', () => {
integrations: [mdx()],
});
await fixture.build();
-
+
const html = await fixture.readFile('/index.html');
const { document } = parseHTML(html);
-
+
const prismCodeBlock = document.querySelector('pre.language-astro');
expect(prismCodeBlock).to.not.be.null;
});