remark-plugins
v0.7.2
Published
A collection of remark plugins for markdown processing.
Downloads
46
Maintainers
Readme
remark-plugins
A collection of remark plugins for markdown processing.
Installation
npm install remark-plugins
# or
yarn add remark-plugins
# or
bun install remark-plugins
# or
pnpm install remark-plugins
Note : These plugins requires
remark-directive
package to run so make sure to install that and call just before remark-plugins.import remarkDirective from 'remark-directive';
Plugins
1. Callout Plugin
Description
Transforms custom callout blocks in markdown into styled callouts.
Usage
import remarkCallout from 'remark-plugins/callout';
// or
import {remarkCallout} from 'remark-plugins';
<ReactMarkdown remarkPlugins={[remarkDirective,remarkCallout]} >
{markdown}
</ReactMarkdown>
Markdown Syntax
::callout[warn]{title=Warning}
This is a custom note content.
:::
2. Embed Plugin
Description
Transforms custom embed blocks in markdown into iframe embeds for YouTube, Vimeo, and other platforms.
Usage
import remarkEmbedfrom 'remark-plugins/embed';
// or
import {remarkEmbed} from 'remark-plugins';
<ReactMarkdown remarkPlugins={[ remarkDirective,remarkEmbed]} >
{markdown}
</ReactMarkdown>
Markdown Syntax
::embed[youtube]{id=yaodD79Q4iE .some-class}
# or
::embed[iframe]{id=http://google.com .some-class}
3. Slugify Headings Plugin
Description
Automatically generates slugified IDs for headings in markdown.
Usage
import slugifyHeading from 'remark-plugins/slugify-heading';
// or
import {slugifyHeading} from 'remark-plugins';
<ReactMarkdown remarkPlugins={[remarkDirective, slugifyHeading]} >
{markdown}
</ReactMarkdown>
Markdown Syntax
# My Heading
This heading will have an ID of `my-heading`.