markdown-it-toc [Deprecated]

Mardown-it的插件，用于生成文档目录，解析toc标记。

安装

bash复制
$ npm install @leisn/markdown-it-toc
or
$ yarn add @leisn/markdown-it-toc

示例

Markdown文档

markdown复制
[toc]
# H1-1
## H2-1
### H3-1
# H1-2

输出Html

html复制
<p>
  <div id="toc" class="toc-wrapper">
    <ul>
      <li>
        <a href="#toc.1">
          <span class="toc-item-index">1</span>
          H1-1
        </a>
      </li>
      <ul>
        <li>
          <a href="#toc.1-1">
            <span class="toc-item-index">1.1</span>
            H2-1
          </a>
        </li>
        <ul>
          <li>
            <a href="#toc.1-1-1">
              <span class="toc-item-index">1.1.1</span>
              H3-1
            </a>
          </li>
        </ul>
      </ul>
      <li>
        <a href="#toc.2">
          <span class="toc-item-index">2</span>
          H1-2
        </a>
      </li>
     </ul>
  </div>
</p>

<h1 id="toc.1" class="toc-heading">
  <span class="toc-heading-prefix">1</span>
  <span class="toc-heading-content">H1-1</span>
  <a href="#toc" class="toc-heading-suffix">#</a>
</h1>
<h2 id="toc.1-1" class="toc-heading">
  <span class="toc-heading-prefix">1.1</span>
  <span class="toc-heading-content">H2-1</span>
  <a href="#toc" class="toc-heading-suffix">#</a>
</h2>
<h3 id="toc.1-1-1" class="toc-heading">
  <span class="toc-heading-prefix">1.1.1</span>
  <span class="toc-heading-content">H3-1</span>
  <a href="#toc" class="toc-heading-suffix">#</a>
</h3>
<h1 id="toc.2" class="toc-heading">
  <span class="toc-heading-prefix">2</span>
  <span class="toc-heading-content">H1-2</span>
  <a href="#toc" class="toc-heading-suffix">#</a>
</h1>

使用

javascript复制
const md = require('markdown-it')(mkOpts) .use(require('@leisn/markdown-it-toc'),options);
console.log(md.render('[toc]\n# h1\n## h2-1\n## h2-2'));

选项

• tocRegexp?: RegExp 正则表达式，匹配 TOC 标记 (default /\[toc\]/im).

• tocTag?: string 生成的TOC元素标签名 ( div by default ).

• tocAttrs?: string Toc元素的属性 id="toc" class="toc-wrapper" by default ).

• headingAttrs?: string 标题元素的属性 h1,h2,h3... ( class="toc-heading" by default )

  html复制
  --------------------------
  # h1 title
  --------------------------
  <h1 {headingAttrs}>
  <span>h1 title</span>
  </h1>
  

• headingContentAttrs?: string 标题内容的属性 span ( class="toc-heading-content" by default )

  html复制
  --------------------------
  # headingContent
  --------------------------
  <h1>
  <span {headingContentAttrs} > headingContent </span>
  </h1>
  

• getToc?(toc: string): boolean (default null)，返回生成的toc元素字符串，如果不想添加进最后生成的html文档就返回false，否则要返回true。

• getPathId?(info): string ：生成标题元素id的方法，重写来自定义, (e.g. for info.paths=[1,2] default return toc-no.1-2 )

• getTocItemContent?(info): string 重写方法来自定义标题内容 a (返回html字符串, 包括标题字符串)

• getHeadingPrefix?(info): string 重写方法，返回html字符串，加在标题内容前面。

  html复制
  --------------------------
  # h1 title
  --------------------------
  <h1>
  {getHeadingPrefix}
  <span>h1 title</span>
  </h1>
  

• getHeadingSuffix?(info): string 重写方法，返回html字符串，加在标题内容后面。

  html复制
  --------------------------
  # h1 title
  --------------------------
  <h1>
  <span>h1 title</span>
  {getHeadingSuffix}
  </h1>
  

测试

bash复制
$ npm run test
or
$ yarn test

LICENSE

MIT