Markdown Hako
便利なMarkdown用プラグインを一括導入できるVSCode拡張機能です。この拡張機能をインストールするだけで、Markdownの編集や表示に役立つ様々な機能を利用できるようになります。
目次
インストール
VScodeのマーケットプレイスで「Markdown Hako」と入力してください｡
プラグイン
「Markdown Hako」をインストールすることで、下記のプラグインが使用可能となります。各プラグインは設定でON/OFFの切り替えのほか、独自のコンフィグを設定することも可能です。
markdown-it-table-of-contents
[[toc]]と書いた箇所に、自動生成された目次をレンダリングするプラグインです。
： markdown-it-table-of-contents
テキスト[^1]及び[^1]: 脚注とセットで書くと、文章下部に脚注が出現します。
： markdown-it-footnote
markdown-it-sup
supは「Superscript（上付き文字）」の略です。x^2^のように^で囲むと、x<sup>2</sup>のように<sup>タグで囲まれてレンダリングされます。
： markdown-it-sup
markdown-it-sub
subは「Subscript（下付き文字）」の略です。H~2~Oのように~で囲むとH<sub>2</sub>Oのように<sub>タグで囲われてレンダリングされます。
： markdown-it-sub
markdown-it-attrs
# タイトル{#カスタムID}とすると、レビューから{#カスタムID}部分は削除されます。また、<h1 id="カスタムID">タイトル</h1>のようにIDが付与されてレンダリングされます。
： markdown-it-attrs
markdown-it-kbd
kbdは「keyboard（キーボード）」の略です。[[ctrl]]+[[shift]]+[[c]]のように各文字を[[]]で囲むと、<kbd>ctrl</kbd>+<kbd>shift</kbd>+<kbd>c</kbd>のように<kbd>で囲われてレンダリングされます。
： markdown-it-kbd
markdown-it-underline
_文字_とすることで<u>underline</u>でレンダリングできるプラグインです。<u>は以前は単なる下線を引くタグでしたが、HTML5で役割が変更されました。主に誤字を指摘する用途に使います。
ちなみにこのプラグインを導入しない場合、_文字_は<em>文字</em>でレンダリングされます。<em>は「強調（emphasis）」を表現するためのタグです。
： markdown-it-underline
markdown-it-mark
==文字==とすることで<mark>文字</mark>でレンダリングされるプラグインです。<mark>は検索結果を表示する際など、文脈上重要な箇所を強調するために使うタグです。
： markdown-it-mark
markdown-it-mojicolor
%文字%{黄色}とすることで、<span style="color: #ffd900;">文字</span>のように指定した色がレンダリングされるプラグインです。
： markdown-it-mojicolor
設定オプション
markdown-hakoには2つの設定があります。
1. プラグインのON/OFF機能
Markdown-hako > Markdown-it-〇〇: Enable（デフォルト: true）
- true（チェック） : プラグインが有効となり、Markdownプレビューに反映されます
- false（チェックを外す） : プラグインは無効になり、Markdownプレビューに反映されなくなります
2. プラグインのオプション設定機能
Markdown-hako > Markdown-it-〇〇: Options（デフォルト: 各プラグインで異なります）
- settings.json で編集 : 各プラグインの詳細設定を編集できます
各プラグインを独自の設定にしたい場合はsettings.json で編集をクリックします。
クレジット
VScode拡張機能で表示されるアイコンは、以下の2つの画像を組み合わせたものです。
謝辞
このプロジェクトの開発にあたり、以下のオープンソースソフトウェアを参考にさせていただきました。この場を借りて感謝の意を表します。
