MDX Presets
Customise the default configurations for MDX processor.
Fumadocs MDX provides MDX presets to simplify configurations of features like syntax highlighting.
Default Preset
A preset designed for documentation sites, it is enabled by default for global MDX options.
To override the defaults, it accepts an interface inherited from ProcessorOptions:
Remark Plugins
These plugins are applied by default:
- Remark Image - Handle images.
- Remark Heading - Extract table of contents.
- Remark Structure - Generate search indexes.
Add other remark plugins with:
import { defineConfig } from 'fumadocs-mdx/config';
import { myPlugin } from './remark-plugin';
export default defineConfig({
mdxOptions: {
remarkPlugins: [myPlugin],
// You can also pass a function to control the order of remark plugins.
remarkPlugins: (v) => [myPlugin, ...v],
},
});Rehype Plugins
These plugins are applied by default:
- Rehype Code - Syntax highlighting.
- Rehype TOC - Export table of contents.
Same as remark plugins, you can pass an array or a function to add other rehype plugins.
import { defineConfig } from 'fumadocs-mdx/config';
import { myPlugin } from './rehype-plugin';
export default defineConfig({
mdxOptions: {
rehypePlugins: (v) => [myPlugin, ...v],
},
});Customise Built-in Plugins
Customise the options of built-in plugins like:
import { defineConfig } from 'fumadocs-mdx/config';
export default defineConfig({
mdxOptions: {
rehypeCodeOptions: {
// options
},
remarkImageOptions: {
// options
},
remarkHeadingOptions: {
// options
},
},
});