remark-hatena-id

This package is a unified (remark) plugin to add Hatena's id notation.

What is id notation?

Hatena's id notation means that if you write something like id:name, it becomes a link.

You can also display icons together by describing them as id:name:detail.

For more information, see はてな記法一覧 - はてなブログ ヘルプ.

Installation

This package is suitable for ESM only.

npm i remark-hatena-id

yarn add remark-hatena-id

pnpm i remark-hatena-id

Usage

Describe example.md using the id notation. The following is an example.

# Title

Hello id:hatena !

import { read } from "to-vfile";
import remark from "remark";
import gfm from "remark-gfm";
import remarkRehype from "remark-rehype";
import rehypeStringify from "rehype-stringify";
import { remarkHatenaId } from "remark-hatena-id";

main();

async function main() {
  const file = await remark()
    .use(gfm)
    .use(remarkHatenaId)
    .use(remarkRehype)
    .use(rehypeStringify)
    .process(await read("example.md"));

  console.log(String(file));
}

Running the script should return the following results.

<h1>Title</h1>
<p>Hello <a href="https://profile.hatena.ne.jp/hatena/" data-hatena-id="hatena">id:hatena</a> !</p>

LICENSE

MIT