Add remark-slug (#862)

* Add remark-slug

* Add remark-slug in documentation

* Add changeset

.changeset/fluffy-pillows-rule.md

@@ -0,0 +1,6 @@
+---
+'docs': patch
+'@astrojs/markdown-support': patch
+---
+
+Added remark-slug to default plugins

docs/src/pages/guides/markdown-content.md

@@ -7,11 +7,11 @@ Astro comes with out-of-the-box Markdown support powered by the expansive [remar
 
 ## Remark and Rehype Plugins
 
-In addition to custom components inside the [`<Markdown>` component](/guides/markdown-content#astros-markdown-component), Astro comes with [GitHub-flavored Markdown](https://github.github.com/gfm/) support, [Footnotes](https://github.com/remarkjs/remark-footnotes) syntax, [Smartypants](https://github.com/silvenon/remark-smartypants), and syntax highlighting via [Prism](https://prismjs.com/) pre-enabled.
+In addition to custom components inside the [`<Markdown>` component](/guides/markdown-content#astros-markdown-component), Astro comes with [GitHub-flavored Markdown](https://github.github.com/gfm/) support, [Footnotes](https://github.com/remarkjs/remark-footnotes) syntax, [Smartypants](https://github.com/silvenon/remark-smartypants), [Remark-slug](https://github.com/remarkjs/remark-slug) and syntax highlighting via [Prism](https://prismjs.com/) pre-enabled.
 
 Also, Astro supports third-party plugins for Markdown. You can provide your plugins in `astro.config.mjs`.
 
-> **Note:** Enabling custom `remarkPlugins` or `rehypePlugins` removes Astro's built-in support for [GitHub-flavored Markdown](https://github.github.com/gfm/) support, [Footnotes](https://github.com/remarkjs/remark-footnotes) syntax, [Smartypants](https://github.com/silvenon/remark-smartypants). You must explicitly add these plugins to your `astro.config.mjs` file, if desired.
+> **Note:** Enabling custom `remarkPlugins` or `rehypePlugins` removes Astro's built-in support for [GitHub-flavored Markdown](https://github.github.com/gfm/) support, [Footnotes](https://github.com/remarkjs/remark-footnotes) syntax, [Smartypants](https://github.com/silvenon/remark-smartypants), [Remark-slug](https://github.com/remarkjs/remark-slug). You must explicitly add these plugins to your `astro.config.mjs` file, if desired.
 
 ## Add a Markdown plugin in Astro
 
@@ -24,7 +24,6 @@ export default {
     remarkPlugins: [
       // Add a Remark plugin that you want to enable for your project.
       // If you need to provide options for the plugin, you can use an array and put the options as the second item.
-      // 'remark-slug',
       // ['remark-autolink-headings', { behavior: 'prepend'}],
     ],
     rehypePlugins: [
@@ -44,7 +43,6 @@ You can provide names of the plugins as well as import them:
 export default {
   markdownOptions: {
     remarkPlugins: [
-      import('remark-slug'),
       [import('remark-autolink-headings'), { behavior: 'prepend' }],
     ],
   },

packages/markdown-support/package.json

@@ -25,6 +25,7 @@
     "remark-gfm": "^1.0.0",
     "remark-parse": "^9.0.0",
     "remark-rehype": "^8.1.0",
+    "remark-slug": "^6.1.0",
     "unified": "^9.2.1",
     "unist-util-map": "^3.0.0"
   },

packages/markdown-support/src/index.ts

@@ -12,6 +12,7 @@ import unified from 'unified';
 import markdown from 'remark-parse';
 import markdownToHtml from 'remark-rehype';
 import rehypeStringify from 'rehype-stringify';
+import remarkSlug from 'remark-slug';
 
 export { AstroMarkdownOptions, MarkdownRenderingOptions };
 
@@ -30,6 +31,7 @@ export async function renderMarkdown(content: string, opts?: MarkdownRenderingOp
   const { headers, rehypeCollectHeaders } = createCollectHeaders();
   let parser = unified()
     .use(markdown)
+    .use(remarkSlug)
     .use([remarkExpressions, { addResult: true }]);
 
   if (remarkPlugins.length === 0) {

yarn.lock

@@ -8295,7 +8295,7 @@ remark-rehype@^8.1.0:
   dependencies:
     mdast-util-to-hast "^10.2.0"
 
-remark-slug@^6.0.0:
+remark-slug@^6.0.0, remark-slug@^6.1.0:
   version "6.1.0"
   resolved "https://registry.yarnpkg.com/remark-slug/-/remark-slug-6.1.0.tgz#0503268d5f0c4ecb1f33315c00465ccdd97923ce"
   integrity sha512-oGCxDF9deA8phWvxFuyr3oSJsdyUAxMFbA0mZ7Y1Sas+emILtO+e5WutF9564gDsEN4IXaQXm5pFo6MLH+YmwQ==