Alexandro.Net

Version 1.0.0

@stackline/remark-gfm

remark plugin to support GFM (autolink literals, footnotes, strikethrough, tables, tasklists)

Independent maintenance of remark-gfm 3.0.1. Original authors and licenses are retained.

Installation

# Preserve existing imports with an npm alias
npm install remark-gfm@npm:@stackline/remark-gfm@1.0.0
# Or use the scoped package name in your imports
npm install @stackline/remark-gfm@1.0.0

Node.js: See compatibility notes. Read the compatibility and maintenance notes before migrating.

Usage and API

The reference below may retain upstream package names. Use the alias installation above to run those imports with this Stackline release.

@stackline/remark-gfm

Independent maintenance fork of remark-gfm@3.0.1, preserving its API and published type declarations.

npm install @stackline/remark-gfm
# Keep existing imports:
npm install remark-gfm@npm:@stackline/remark-gfm@1.0.0

Stackline · Issues · Community

See UPSTREAM.md for source identity and issue review, and CHANGELOG.md for maintenance changes. Functional tests also run against the final npm tarball; releases are published from GitHub Actions with provenance.

Upstream documentation

remark-gfm

Build Coverage Downloads Size Sponsors Backers Chat

remark plugin to support GFM (autolink literals, footnotes, strikethrough, tables, tasklists).

Contents

What is this?

This package is a unified (remark) plugin to enable the extensions to markdown that GitHub adds: autolink literals (www.x.com), footnotes ([^1]), strikethrough (~~stuff~~), tables (| cell |…), and tasklists (* [x]). You can use this plugin to add support for parsing and serializing them. These extensions by GitHub to CommonMark are called GFM (GitHub Flavored Markdown).

unified is a project that transforms content with abstract syntax trees (ASTs). remark adds support for markdown to unified. mdast is the markdown AST that remark uses. This is a remark plugin that transforms mdast.

When should I use this?

This project is useful when you want to support the same features that GitHub does in files in a repo, Gists, and several other places. Users frequently believe that some of these extensions, specifically autolink literals and tables, are part of normal markdown, so using remark-gfm will help match your implementation to their understanding of markdown. There are several edge cases where GitHub’s implementation works in unexpected ways or even different than described in their spec, so writing in GFM is not always the best choice.

This plugin does not handle how markdown is turned to HTML. That’s done by remark-rehype. If your content is not in English and uses footnotes, you should configure that plugin. When generating HTML, you might also want to enable rehype-slug to add ids on headings.

A different plugin, remark-frontmatter, adds support for frontmatter. GitHub supports YAML frontmatter for files in repos and Gists but they don’t treat it as part of GFM.

Another plugin, remark-github, adds support for how markdown works in relation to a certain GitHub repo in comments, issues, PRs, and releases, by linking references to commits, issues, and users.

Yet another plugin, remark-breaks, turns soft line endings (enters) into hard breaks (<br>s). GitHub does this in a few places (comments, issues, PRs, and releases).

Install

This package is ESM only. In Node.js (version 12.20+, 14.14+, or 16.0+), install with npm:

npm install remark-gfm

In Deno with Skypack:

import remarkGfm from 'https://cdn.skypack.dev/remark-gfm@3?dts'

In browsers with Skypack:

<script type="module">
  import remarkGfm from 'https://cdn.skypack.dev/remark-gfm@3?min'
</script>

Use

Say we have the following file example.md:

# GFM

## Autolink literals

www.example.com, https://example.com, and contact@example.com.

## Footnote

A note[^1]

[^1]: Big note.

## Strikethrough

~one~ or ~~two~~ tildes.

## Table

| a | b  |  c |  d  |
| - | :- | -: | :-: |

## Tasklist

* [ ] to do
* [x] done

And our module example.js looks as follows:

import {read} from 'to-vfile'
import {unified} from 'unified'
import remarkParse from 'remark-parse'
import remarkGfm from 'remark-gfm'
import remarkRehype from 'remark-rehype'
import rehypeStringify from 'rehype-stringify'

main()

async function main() {
  const file = await unified()
    .use(remarkParse)
    .use(remarkGfm)
    .use(remarkRehype)
    .use(rehypeStringify)
    .process(await read('example.md'))

  console.log(String(file))
}

Now running node example yields:

<h1>GFM</h1>
<h2>Autolink literals</h2>
<p><a href="http://www.example.com">www.example.com</a>, <a href="https://example.com">https://example.com</a>, and <a href="mailto:contact@example.com">contact@example.com</a>.</p>
<h2>Footnote</h2>
<p>A note<sup><a href="#user-content-fn-1" id="user-content-fnref-1" data-footnote-ref aria-describedby="footnote-label">1</a></sup></p>
<h2>Strikethrough</h2>
<p><del>one</del> or <del>two</del> tildes.</p>
<h2>Table</h2>
<table>
<thead>
<tr>
<th>a</th>
<th align="left">b</th>
<th align="right">c</th>
<th align="center">d</th>
</tr>
</thead>
</table>
<h2>Tasklist</h2>
<ul class="contains-task-list">
<li class="task-list-item"><input type="checkbox" disabled> to do</li>
<li class="task-list-item"><input type="checkbox" checked disabled> done</li>
</ul>
<section data-footnotes class="footnotes"><h2 id="footnote-label" class="sr-only">Footnotes</h2>
<ol>
<li id="user-content-fn-1">
<p>Big note. <a href="#user-content-fnref-1" data-footnote-backref class="data-footnote-backref" aria-label="Back to content">↩</a></p>
</li>
</ol>
</section>

API

This package exports no identifiers. The default export is remarkGfm.

unified().use(remarkGfm[, options])

Plugin to support GFM (autolink literals, footnotes, strikethrough, tables, tasklists).

options

Configuration (optional).

options.singleTilde

Whether to parse strikethrough with a single tilde (boolean, default: true). Single tildes work on github.com, but are technically prohibited by the GFM spec.

options.tableCellPadding

Serialize tables with a space between delimiters (|) and cell content (boolean, default: true).

options.tablePipeAlign

Serialize by aligning the delimiters (|) between table cells so that they all align nicely and form a grid (boolean, default: true).

options.stringLength

Function to detect the length of table cell content (Function, default: s => s.length). This is used when aligning the delimiters (|) between table cells. Full-width characters and emoji mess up delimiter alignment when viewing the markdown source. To fix this, you can pass this function, which receives the cell content and returns its “visible” size. Note that what is and isn’t visible depends on where the text is displayed.

Examples

Example: singleTilde

To turn off support for parsing strikethrough with single tildes, pass singleTilde: false:

// …

const file = await unified()
  .use(remarkParse)
  .use(remarkGfm, {singleTilde: false})
  .use(remarkRehype)
  .use(rehypeStringify)
  .process('~one~ and ~~two~~')

console.log(String(file))

Yields:

<p>~one~ and <del>two</del></p>

Example: stringLength

It’s possible to align tables based on the visual width of cells. First, let’s show the problem:

import {remark} from 'remark'
import remarkGfm from 'remark-gfm'

main()

async function main() {
  const input = `| Alpha | Bravo |
| - | - |
| 中文 | Charlie |
| 👩‍❤️‍👩 | Delta |`

  const file = await remark()
    .use(remarkGfm)
    .process(input)

  console.log(String(file))
}

The above code shows how remark can be used to format markdown. The output is as follows:

| Alpha    | Bravo   |
| -------- | ------- |
| 中文       | Charlie |
| 👩‍❤️‍👩 | Delta   |

To improve the alignment of these full-width characters and emoji, pass a stringLength function that calculates the visual width of cells. One such algorithm is string-width. It can be used like so:

@@ -1,5 +1,6 @@
 import {remark} from 'remark'
 import remarkGfm from 'remark-gfm'
+import stringWidth from 'string-width'

 main()

@@ -10,7 +11,7 @@ async function main() {
 | 👩‍❤️‍👩 | Delta |`

   const file = await remark()
-    .use(remarkGfm)
+    .use(remarkGfm, {stringLength: stringWidth})
     .process(input)

   console.log(String(file))

The output of our code with these changes is as follows:

| Alpha | Bravo   |
| ----- | ------- |
| 中文  | Charlie |
| 👩‍❤️‍👩    | Delta   |

Types

This package is fully typed with TypeScript. It exports an Options type, which specifies the interface of the accepted options.

Compatibility

Projects maintained by the unified collective are compatible with all maintained versions of Node.js. As of now, that is Node.js 12.20+, 14.14+, and 16.0+. Our projects sometimes work with older versions, but this is not guaranteed.

This plugin works with remark-parse version 10+ (remark version 14+). The previous version (v2) worked with remark-parse version 9 (remark version 13). Earlier versions of remark-parse and remark had a gfm option that enabled this functionality, which defaulted to true.

Security

Use of remark-gfm does not involve rehype (hast) so there are no openings for cross-site scripting (XSS) attacks.

Related

Contribute

See contributing.md in remarkjs/.github for ways to get started. See support.md for ways to get help.

This project has a code of conduct. By interacting with this repository, organization, or community you agree to abide by its terms.

License

MIT © Titus Wormer

Upstream issues and maintenance review

Upstream and maintenance review

Independent maintenance of remark-gfm@3.0.1 as @stackline/remark-gfm.

Issue triage

Historical snapshots were checked against an independently installed exact original npm package before refresh. All fixtures retain differential AST and serialization checks against that original package.

The evidence query fetched the latest 100 open and 30 closed issue/PR entries and removed PRs. This is a bounded review, not a claim of exhaustive issue history or resolution of every issue.

Release verification

GitHub Actions publishes the reviewed passing-CI tarball. Release completion requires exact source identity, zero open CodeQL alerts, npm provenance and tarball identity, normal and aliased installs, and matching immutable GitHub release assets. Existing versions are never replaced.

Release changes

Changelog

1.0.0

Release files and references

Package bytes, npm provenance and the immutable GitHub release were verified for this version. Security checks describe the reviewed release; documented compatibility risks and upstream reports are not blanket claims of resolution.