From c2275ca1f80bd2a3f9f1da2ee84094ae939f2724 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Tue, 5 Nov 2024 13:10:06 -0400 Subject: [PATCH 1/3] update markdown config docs --- packages/astro/src/@types/astro.ts | 51 +++++++++++++++++++++++++++--- 1 file changed, 46 insertions(+), 5 deletions(-) diff --git a/packages/astro/src/@types/astro.ts b/packages/astro/src/@types/astro.ts index 9494605b1d02..5c4b10465b48 100644 --- a/packages/astro/src/@types/astro.ts +++ b/packages/astro/src/@types/astro.ts @@ -64,7 +64,7 @@ export type { MarkdownHeading, RehypePlugins, RemarkPlugins, - ShikiConfig, + , } from '@astrojs/markdown-remark'; export type { ExternalImageService, @@ -1438,7 +1438,48 @@ export interface AstroUserConfig { * @name markdown.shikiConfig * @typeraw {Partial} * @description - * Shiki configuration options. See [the Markdown configuration docs](https://docs.astro.build/en/guides/markdown-content/#shiki-configuration) for usage. + * Shiki is our default syntax highlighter. You can configure all options via the `markdown.shikiConfig` object: + * + * ```js title="astro.config.mjs" + * import { defineConfig } from 'astro/config'; + * + * export default defineConfig({ + * markdown: { + * shikiConfig: { + * // Choose from Shiki's built-in themes (or add your own) + * // https://shiki.style/themes + * theme: 'dracula', + * // Alternatively, provide multiple themes + * // See note below for using dual light/dark themes + * themes: { + * light: 'github-light', + * dark: 'github-dark', + * }, + * // Disable the default colors + * // https://shiki.style/guide/dual-themes#without-default-color + * // (Added in v4.12.0) + * defaultColor: false, + * // Add custom languages + * // Note: Shiki has countless langs built-in, including .astro! + * // https://shiki.style/languages + * langs: [], + * // Add custom aliases for languages + * // Map an alias to a Shiki language ID: https://shiki.style/languages#bundled-languages + * // https://shiki.style/guide/load-lang#custom-language-aliases + * langAlias: { + * cjs: "javascript" + * }, + * // Enable word wrap to prevent horizontal scrolling + * wrap: true, + * // Add custom transformers: https://shiki.style/guide/transformers + * // Find common transformers: https://shiki.style/packages/transformers + * transformers: [], + * }, + * }, + * }); + * ``` + * + * See the [code syntax highlighting guide](/en/guides/syntax-highlighting/) for usage and examples. */ shikiConfig?: Partial; @@ -1448,9 +1489,9 @@ export interface AstroUserConfig { * @type {'shiki' | 'prism' | false} * @default `shiki` * @description - * Which syntax highlighter to use, if any. - * - `shiki` - use the [Shiki](https://shiki.style) highlighter - * - `prism` - use the [Prism](https://prismjs.com/) highlighter + * Which syntax highlighter to use for Markdown code blocks (/`/`/`), if any. This determines the CSS classes that Astro will apply to your Markdown code blocks. + * - `shiki` - use the [Shiki](https://shiki.style) highlighter (`github-dark` theme configured by default) + * - `prism` - use the [Prism](https://prismjs.com/) highlighter and [provide your own Prism stylesheet](/en/guides/syntax-highlighting/#add-a-prism-stylesheet) * - `false` - do not apply syntax highlighting. * * ```js From 168f1283566070eeb34814a87c70c1fa138355e2 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Tue, 5 Nov 2024 14:32:16 -0400 Subject: [PATCH 2/3] typo fix Co-authored-by: Armand Philippot --- packages/astro/src/@types/astro.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/astro/src/@types/astro.ts b/packages/astro/src/@types/astro.ts index 5c4b10465b48..5892508deeee 100644 --- a/packages/astro/src/@types/astro.ts +++ b/packages/astro/src/@types/astro.ts @@ -64,7 +64,7 @@ export type { MarkdownHeading, RehypePlugins, RemarkPlugins, - , + ShikiConfig, } from '@astrojs/markdown-remark'; export type { ExternalImageService, From d85b1742441f17f9be07957c6999b8bed5a43ad2 Mon Sep 17 00:00:00 2001 From: Sarah Rainsberger Date: Wed, 6 Nov 2024 08:51:29 -0400 Subject: [PATCH 3/3] fix backticks Co-authored-by: Junseong Park --- packages/astro/src/@types/astro.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/astro/src/@types/astro.ts b/packages/astro/src/@types/astro.ts index 5892508deeee..f123436e016f 100644 --- a/packages/astro/src/@types/astro.ts +++ b/packages/astro/src/@types/astro.ts @@ -1489,7 +1489,7 @@ export interface AstroUserConfig { * @type {'shiki' | 'prism' | false} * @default `shiki` * @description - * Which syntax highlighter to use for Markdown code blocks (/`/`/`), if any. This determines the CSS classes that Astro will apply to your Markdown code blocks. + * Which syntax highlighter to use for Markdown code blocks (\`\`\`), if any. This determines the CSS classes that Astro will apply to your Markdown code blocks. * - `shiki` - use the [Shiki](https://shiki.style) highlighter (`github-dark` theme configured by default) * - `prism` - use the [Prism](https://prismjs.com/) highlighter and [provide your own Prism stylesheet](/en/guides/syntax-highlighting/#add-a-prism-stylesheet) * - `false` - do not apply syntax highlighting.