rehype-mdx-title


A rehype MDX plugin for exposing the page title

Table of Contents

- Installation
- Usage
- API
- Options
- Compatibility
- License

Installation

``sh
npm install rehype-mdx-title
`

Usage

This plugins exports the page title as a string. If multiple matching headers are found, othe
highest ranking header is used. If multiple headers are found with the same rank, the first one in
the document is used. The header is converted to a string using
mdast-util-to-string

For example, given a file named example.mdx with the following contents:

`mdx


The answer to _life_, the universe, and everything

{title} is 42
`

The following script:

`js
import { readFile } from 'node:fs/promises'

import { compile } from '@mdx-js/mdx'
import rehypeMdxTitle from 'rehype-mdx-title'

const { value } = await compile(await readFile('example.mdx'), {
jsx: true,
rehypePlugins: [rehypeMdxTitle]
})
console.log(value)
`

Roughly yields:

`jsx
export const title = 'The answer to life, the universe, and everything'

export default function MDXContent() {
return (
<>



{'The '}

answer

{' to '}
life
{', the '}
universe
{', and '}
everything


{title}
{' is 42'}

)
}
`

Use rehype-raw if you wish to use custom

headers.
This only works if the MDX format option is set to 'md'. Beware this also changes the MDX
component output.

API

$3

- name (string) — The name of the variable to export the title as. (default: 'title')
- maxRank (number) — The maximum heading rank to consider. (default: 1)

In addition it supports unist-util-mdx-define`
options.

Compatibility

This project is compatible with Node.js 16 or greater.

License

MIT © Remco Haszing