From 7fbd7d32c6e8d96874625a6d8077d61e265ed3a1 Mon Sep 17 00:00:00 2001 From: bluwy Date: Thu, 2 May 2024 16:19:50 +0800 Subject: [PATCH 1/3] Update mdx integration docs for v3 --- .../docs/en/guides/integrations-guide/mdx.mdx | 13 +++++++------ 1 file changed, 7 insertions(+), 6 deletions(-) diff --git a/src/content/docs/en/guides/integrations-guide/mdx.mdx b/src/content/docs/en/guides/integrations-guide/mdx.mdx index e1fbb231b2302..2cd45417efab2 100644 --- a/src/content/docs/en/guides/integrations-guide/mdx.mdx +++ b/src/content/docs/en/guides/integrations-guide/mdx.mdx @@ -196,7 +196,7 @@ We suggest [using AST Explorer](https://astexplorer.net/) to play with estree ou ### `optimize` -* **Type:** `boolean | { customComponentNames?: string[] }` +* **Type:** `boolean | { ignoreElementNames?: string[] }` This is an optional configuration setting to optimize the MDX output for faster builds and rendering via an internal rehype plugin. This may be useful if you have many MDX files and notice slow builds. However, this option may generate some unescaped HTML, so make sure your site's interactive parts still work correctly after enabling it. @@ -216,11 +216,13 @@ export default defineConfig({ }); ``` -#### `customComponentNames` +#### `ignoreElementNames` * **Type:** `string[]` -An optional property of `optimize` to prevent the MDX optimizer from handling any [custom components passed to imported MDX content via the components prop](/en/guides/markdown-content/#custom-components-with-imported-mdx). +Previously known as `customComponentNames` in `@astrojs/mdx` v2. + +An optional property of `optimize` to prevent the MDX optimizer from handling certain element names, like [custom components passed to imported MDX content via the components prop](/en/guides/markdown-content/#custom-components-with-imported-mdx). You will need to exclude these components from optimization as the optimizer eagerly converts content into a static string, which will break custom components that needs to be dynamically rendered. @@ -235,7 +237,7 @@ import Heading from '../Heading.astro'; ``` -To configure optimization for this using the `customComponentNames` property, specify an array of HTML element names that should be treated as custom components: +To configure optimization for this using the `ignoreElementNames` property, specify an array of HTML element names that should be treated as custom components: ```js title="astro.config.mjs" import { defineConfig } from 'astro/config'; @@ -247,8 +249,7 @@ export default defineConfig({ mdx({ optimize: { // Prevent the optimizer from handling `h1` elements - // These will be treated as custom components - customComponentNames: ['h1'], + ignoreElementNames: ['h1'], }, }), ], From 8c1e4f0bc30a8c49dd20a1567fde6feae5e47e40 Mon Sep 17 00:00:00 2001 From: bluwy Date: Mon, 6 May 2024 00:47:55 +0800 Subject: [PATCH 2/3] Use since component Co-authored-by: Sarah Rainsberger --- src/content/docs/en/guides/integrations-guide/mdx.mdx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/content/docs/en/guides/integrations-guide/mdx.mdx b/src/content/docs/en/guides/integrations-guide/mdx.mdx index 2cd45417efab2..0d99ad28d5607 100644 --- a/src/content/docs/en/guides/integrations-guide/mdx.mdx +++ b/src/content/docs/en/guides/integrations-guide/mdx.mdx @@ -8,6 +8,7 @@ i18nReady: true --- import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro' import ReadMore from '~/components/ReadMore.astro' +import Since from '~/components/Since.astro' This **[Astro integration][astro-integration]** enables the usage of [MDX](https://mdxjs.com/) components and allows you to create pages as `.mdx` files. @@ -220,7 +221,8 @@ export default defineConfig({ * **Type:** `string[]` -Previously known as `customComponentNames` in `@astrojs/mdx` v2. +

+Previously known as `customComponentNames`. An optional property of `optimize` to prevent the MDX optimizer from handling certain element names, like [custom components passed to imported MDX content via the components prop](/en/guides/markdown-content/#custom-components-with-imported-mdx). From 3f00b94ab9ec82aed1fbbf8e6c03319528bc8e15 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Tue, 7 May 2024 09:19:48 -0300 Subject: [PATCH 3/3] full package name for Since component --- src/content/docs/en/guides/integrations-guide/mdx.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/docs/en/guides/integrations-guide/mdx.mdx b/src/content/docs/en/guides/integrations-guide/mdx.mdx index 0d99ad28d5607..b08b24602686e 100644 --- a/src/content/docs/en/guides/integrations-guide/mdx.mdx +++ b/src/content/docs/en/guides/integrations-guide/mdx.mdx @@ -221,7 +221,7 @@ export default defineConfig({ * **Type:** `string[]` -

+

Previously known as `customComponentNames`. An optional property of `optimize` to prevent the MDX optimizer from handling certain element names, like [custom components passed to imported MDX content via the components prop](/en/guides/markdown-content/#custom-components-with-imported-mdx).