Add ability to load plugins

website/next.config.mjs

@@ -1,8 +1,11 @@
 import MDX from '@next/mdx'
 
+import remarkPlugins from './plugins/index.mjs'
+
 const withMDX = MDX({
     extension: /\.mdx?$/,
     options: {
+        remarkPlugins,
         providerImportSource: '@mdx-js/react',
     },
     experimental: {

website/pages/[slug].tsx

@@ -4,6 +4,7 @@ import fs from 'fs'
 import { MDXRemote, MDXRemoteSerializeResult } from 'next-mdx-remote'
 import path from 'path'
 import Layout from '../components/layout'
+import remarkPlugins from '../plugins/index.mjs'
 
 type PropsPage = {
     mdx: MDXRemoteSerializeResult
@@ -43,7 +44,12 @@ export const getStaticProps: GetStaticProps<PropsPage, ParsedUrlQuery> = async (
             slug: args.params.slug,
             mdx: await serialize(
                 fs.readFileSync(path.join('docs', args.params.slug + '.mdx'), 'utf-8'),
-                { parseFrontmatter: true }
+                {
+                    parseFrontmatter: true,
+                    mdxOptions: {
+                        remarkPlugins,
+                    },
+                }
             ),
         },
     }

website/plugins/index.mjs

@@ -0,0 +1,3 @@
+const remarkPlugins = []
+
+export default remarkPlugins