Jump To

Installation and Getting Started

Download the latest release or install via NPM

npm install linkifyjs linkify-html

Quick Start

Option 1: Import with a module loader

When developing in an environment with JavaScript module loader such as Webpack, use an import statement:

import * as linkify from "linkifyjs";
import linkifyHtml from "linkify-html";

Or in Node.js with CommonJS modules

const linkify = require("linkifyjs");
const linkifyHtml = require("linkify-html");

Option 2: Download and import for direct use in the browser

If using JavaScript directly in the browser, download the latest release and add linkify and linkify-html scripts to your HTML:

<script src="linkify.min.js"></script>
<script src="linkify-html.min.js"></script>

Note: When linkify-ing text that does not contain HTML, install and use the linkify-string package instead of linkify-html. Read more about Linkify’s interfaces.

Option 3: Import from a CDN

Include Linkify in your HTML from any NPM-compatible CDN such as jsDelivr. The latest browser scripts are located in the dist subdirectory. This applies to linkifyjs and all related modules such as linkify-react or linkify-plugin-hashtag

<script src="https://cdn.jsdelivr.net/npm/linkifyjs@4.1.3/dist/linkify.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/linkify-html@4.1.3/dist/linkify-html.min.js"></script>

This also creates global variables linkify and linkifyHtml

Usage

const options = { defaultProtocol: "https" };
linkifyHtml(
  "Any links to github.com here? If not, contact test@example.com",
  options
);

Returns the following string:

'Any links to <a href="https://github.com">github.com</a> here? If not, contact <a href="mailto:test@example.com">test@example.com</a>';

To modify the resulting links with a target attribute, class name and more, use the available options.

linkify.find("Any links to github.com here? If not, contact test@example.com");

Returns the following array

[
  {
    type: "url",
    value: "github.com",
    isLink: true,
    href: "http://github.com",
    start: 13,
    end: 23,
  },
  {
    type: "email",
    value: "test@example.com",
    isLink: true,
    href: "mailto:test@example.com",
    start: 46,
    end: 62,
  },
];

Check if as string is a valid URL or email address:

linkify.test("github.com"); // true

Check if a string is a valid email address:

linkify.test("github.com", "email"); // false
linkify.test("noreply@github.com", "email"); // true

Usage with React, jQuery or the browser DOM

Read the interface documentation to learn how to use linkify when working with a specific JavaScript environment such as React.

Plugins for @mentions, #hashtags and more

By default Linkify will only detect and highlight web URLs and e-mail addresses. Plugins for @mentions, #hashtags and more may be installed separately. Read the plugin documentation.

Browser Support

Linkify natively supports all modern browsers. Linkify is tested on Internet Explorer 11 and above.