Skip to content
Add `id` attributes to headings
Branch: master
Clone or download
Latest commit 4e5765e Nov 17, 2018
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.editorconfig Initial commit Oct 22, 2016
.gitignore Add `yarn.lock` to `.gitignore` Jul 19, 2018
.npmrc
.prettierignore Refactor code-style Jul 19, 2018
.travis.yml
index.js
license
package.json 2.0.2 Nov 17, 2018
readme.md
test.js Refactor code-style Jul 19, 2018

readme.md

rehype-slug

Build Coverage Downloads Chat

Add ids to headings with rehype.

Installation

npm:

npm install rehype-slug

Usage

Say we have the following file, fragment.html:

<h1>Lorem ipsum 😪</h1>
<h2>dolor—sit—amet</h2>
<h3>consectetur &amp; adipisicing</h3>
<h4>elit</h4>
<h5>elit</h5>

And our script, example.js, looks as follows:

var fs = require('fs')
var rehype = require('rehype')
var slug = require('rehype-slug')

rehype()
  .data('settings', {fragment: true})
  .use(slug)
  .process(fs.readFileSync('fragment.html'), function(err, file) {
    if (err) throw err
    console.log(String(file))
  })

Now, running node example yields:

<h1 id="lorem-ipsum-">Lorem ipsum 😪</h1>
<h2 id="dolorsitamet">dolor—sit—amet</h2>
<h3 id="consectetur--adipisicing">consectetur &#x26; adipisicing</h3>
<h4 id="elit">elit</h4>
<h5 id="elit-1">elit</h5>

API

rehype().use(slug)

Adds id properties to h1-h6 headings which don’t already have one.

Uses github-slugger (thus creating GitHub style ids).

Related

Contribute

See contributing.md in rehypejs/rehype for ways to get started.

This organisation has a Code of Conduct. By interacting with this repository, organisation, or community you agree to abide by its terms.

License

MIT © Titus Wormer

You can’t perform that action at this time.