React Markdown Autolink

Automatically Detect and Add Hyperlinks to Your Markdown Content

A highly lightweight utility that automatically detects and makes links clickable in Markdown rendered by react-markdown or other markdown renderers.

Key Features

✅ Automatic Link Detection: Automatically detects URLs and makes them clickable in your Markdown content.

✅ Lightweight: Minimal overhead, ensuring fast and efficient performance.

✅ Seamless Integration: Easily integrates with react-markdown and other React, Vue, web components, or any other framework/library supporting markdown.

✅ TypeScript First: Built with TypeScript, ensuring type safety and developer-friendly experience.

Please consider starring this repository and sharing it with your friends.

Getting Started

Installation

pnpm add react-markdown-autolink

or

npm install react-markdown-autolink

or

yarn add react-markdown-autolink

Usage

import Markdown from "react-markdown";
import { autoLinkMd } from "react-markdown-autolink";

const md = `## Automatically Detect and Add Hyperlinks to Your Markdown Content
https://github.com/react18-tools/react-markdown-autolink
`;

export default function Page(): JSX.Element {
  return <Markdown>{autoLinkMd(md)}</Markdown>;
}

License

This library is licensed under the MPL-2.0 open-source license.

Please consider enrolling in our courses or sponsoring our work.