Make slug for each headings and assign to id attribute

[yhatt]

Marp Core now makes a compatible slug with GitHub for each headings, and assign to id attribute.

# Hello, world!

<h1 id="hello-world">...</h1>

It has got to be compatible with Markdown Language Server to improve IDE integrations.

Customization

When integrating Marp Core with Web app, the user-generated id may conflict with exist ids using in the app. So the developer can tweak slug generation through slug constructor option.

• slug: boolean | function | object
  • true (default): Enable GitHub-compatible slugify to each headings.
  • false: Disable slugify. It's helpful when showing unpredictable Markdown input on the web page.
  • Function: Define custom slugifier.
  • Object:
    • slugifier: Define custom slugifier.
    • postSlugify: Define custom post process that would be invoked before assigning the slug to id attribute. It is useful for appending prefix or suffix to avoid duplicated IDs.

Combination with Marpit's anchor option

Marpit framework also has an anchor option to assign id to each slides. If a generated slug was conflicted with already generated anchors by Marpit, Marp Core will add a number suffix to avoid duplicated IDs by the default postSlugify function.

# 1

<section id="1">
  <h1 id="1-1">1</h1>
</section>

ToDo

• Add test cases about GitHub-compatible slug generation
• Add documentation

Close #299.