読者です 読者をやめる 読者になる 読者になる

Markdownに目次(TOC)を表示させる

Markdown

概要

f:id:tsunokawa:20160421143745p:plain
Markdownでこういった目次を作るメモです。


github.com
こちらを利用させていただきました。
Markdownファイルを指定して実行すると簡単に指定の場所に目次を作ることが出来ます。

インストール

npm install -g doctoc


表示例

npm WARN engine deep-extend@0.4.1: wanted: {"node":">=0.12.0","iojs":">=1.0.0"} (current: {"node":"0.10.33","npm":"2.13.1"})
/usr/local/bin/doctoc -> /usr/local/lib/node_modules/doctoc/doctoc.js
doctoc@1.0.0 /usr/local/lib/node_modules/doctoc
├── underscore@1.8.3
├── anchor-markdown-header@0.5.4
├── update-section@0.3.3
├── minimist@1.1.3
├── htmlparser2@3.7.3 (domelementtype@1.3.0, domhandler@2.2.1, entities@1.0.0, readable-stream@1.1.14, domutils@1.5.1)
└── markdown-to-ast@3.0.7 (traverse@0.6.6, debug@2.2.0, structured-source@3.0.2, mdast@1.2.0)

実行すると上記のようにインストールが完了します。

使い方

ここでは例として以下のREADME.mdの目次(TOC)を作ります。

Markdownファイルサンプル
# test

## test1
### test1-1
hoge

### test1-2
moge

## test2
### test2-2
fuga


目次挿入箇所を指定

目次を入れたい箇所に以下を追記します。

<!-- START doctoc -->
<!-- END doctoc -->


準備が整ったMarkdownファイル

以下のようにすると#test##test1の間に目次が挿入されます。

# test

<!-- START doctoc -->
<!-- END doctoc -->

## test1
### test1-1
hoge

### test1-2
moge

## test2
### test2-2
fuga


実行

以下コマンドでMarkdownファイルの指定箇所に目次が挿入されます。

doctoc README.md --github


表示例

DocToccing single file "README.md" for github.com.

==================

"README.md" will be updated

Everything is OK.


オプションで--githubと指定していますが他にも

--bitbucket
--nodejs
--github
--gitlab
--ghost

と選ぶことが可能です。
環境に合わせて切替えてください。

目次が追記されたMarkdownファイル

以下のように指定箇所に目次が入りました。

# test

<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->


- [test1](#test1)
  - [test1-1](#test1-1)
  - [test1-2](#test1-2)
- [test2](#test2)
  - [test2-2](#test2-2)

<!-- END doctoc generated TOC please keep comment here to allow auto update -->

## test1
### test1-1
hoge

### test1-2
moge

## test2
### test2-2
fuga


完成

目次が表示されました。
f:id:tsunokawa:20160421143553p:plain