remark-custom-heading-id

Support for Heading ID Markdown Extensions for Remark, compatible with MDX.js.

Get Started

Most users should use remark-custom-heading-id:

``bash
$ npm install remark-custom-heading-id --save
`

$3

`js
import {remarkHeadingId} from 'remark-custom-heading-id';
import {remark} from 'remark';
import html from 'remark-rehype';
import stringify from 'rehype-stringify';

const result = remark()
.use(remarkHeadingId)
.use(html)
.use(stringify)
.processSync(# Hello, world {#hello});
console.log(String(result));

// Outputs:
//

Hello, world


`

$3

`js
import {remarkHeadingId} from 'remark-custom-heading-id';
import {remark} from 'remark';
import remarkMdx from 'remark-mdx';
import html from 'remark-rehype';
import stringify from 'rehype-stringify';

const result = remark()
.use(remarkMdx)
.use(remarkHeadingId)
.use(html)
.use(stringify)
.processSync(# Hello, world {#hello});

console.log(String(result));

// Outputs:
//

Hello, world


`

$3

`js
import {remarkHeadingId} from 'remark-custom-heading-id';
import {serialize} from 'next-mdx-remote/serialize'; // or similar...

export default async function getMdxProps(source) {
return await serialize(source, {
mdxOptions: {
remarkPlugins: [remarkHeadingId],
},
});
}
``