今回はMarkdownファイルをHTMLに変換してプレビューできるChromeの拡張機能についてです。
1.はじめに
MarkDownファイルはMarkdown記法で書かれたテキストファイルです。
Markdown記法についてはwkipedia（Markdown）さん参照。
ざっくり言うとHTMLのタグをもっと書きやすくした書き方です。
このMarkDownファイルをChromeでHTMLに変換して綺麗に表示してくれる拡張機能です。
2.Markdown Preview Plus
2-1.インストール
①Chromeウェブストア「Markdown Preview Plus」を開いて「Chromeに追加する」ボタンをクリック。
②追加するか聞かれるので「拡張機能を追加」をクリック
③これでインストールは完了です。
2-2.初期設定
①拡張機能の画面を表示して「Markdown Preview Plus」の「詳細」を表示
拡張機能画面の表示はChromeブラウザの拡張機能のマークをクリックして「拡張機能を管理」から開きます。
拡張機能の画面が開いたら、「Markdown Markdown Preview Plus」の「詳細」をクリックします。
②「ファイルのURLへのアクセスを許可する」をクリップして有効にします。
★重要★これが有効になっていないと、ローカルファイルをChromeで表示してもMarkdownファイルをHTMLに変換してくれません。
2-3.実際の表示
昔（2018年ぐらいまで）は日記（兼メモ）をローカルのテキストファイルで書いていてその際、MarkDown記法を使っていたのでこの日記ファイルを実際に表示してみます。
このファイルを普通のテキストエディタで開くと以下のように、MarkDown記法で記載されています。
使い方はMarkdownファイルをドラッグ＆ドロップでChromeに放り込むだけです。
するとこのようにMarkdownをHTMLに変換して表示してくれます。
2-4.追加の設定
①「Markdown Preview Plus」のオプションを開く
Chromeの拡張機能マークをクリックして、拡張機能一覧の「Markdown Preview Plus」をクリックします。
「Option」をクリックします。
設定画面が開きます。
各設定項目の説明
・Mermaid & KaTeX support inline($math$ or (math)) and line($$math$$ or [math]
「Mermaid」はMarkdownテキストで図やフローチャートを作成するツールで、「KaTex」はウェブサイトで数式を綺麗に表示できるソフトウェアです。
このチェックを入れると、「Mermaid」と「KaTeX」の記法も使えますよ。ということですが私は使ってないのでオフにしてます。
・Enable auto-reload
オートリロードはMarkdown Preview Plusで表示したまま、元のmarkdownファイルを編集すると、更新内容をプレビューにも反映してくれます。
私はプレビューしながらファイルを編集することも多いのでチェックを入れて有効にしています。
・Enable Table Of Content
見出しを基にTable Of Content、つまり目次を生成してくれます。
が、なんかうまく機能しないので私はオフにしています。
・Reload Frequency（リロード頻度）
オートリロードを有効にしている場合に関係する設定です。
リロードする頻度を「1秒～5秒」まで秒単位で変更できます。
デフォルトの「3秒」で特に気にならないので、デフォルトにしています。
・Themes（テーマ）
プレビューする時のテーマ（デザイン）を変更できます。
種類は少ないですが、私は「Github」しか使ってないので問題なかったです。
・「Or add a customize CSS」「Or input CSS files path. One css file per line」
用意されたテーマ以外でCSSを使いたい時に、CSSファイルを反映する項目です。
・Supported file extensions
markdownファイルとして認識するファイルの拡張子です。
デフォルトで全部チェックが入っているのでそのままです。
3.おわりに
MarkDownについては、VScodeなどエディタ側で対応しているものもあるのでなくてもいいかもですが、編集はしないけどちょっとMarkDownで見たいっていう時に便利です。
あとMarkdown系のビューワはMarkdown自体に若干方言のような感じで種類があるので、MarkDownとして表示変換できる書き方、表示変換できない書き方があるのでそこは注意が必要です。
私は方言に影響しない代表的な書き方だけ使うようにはしてます。そもそもそんなに装飾しない簡易マークアップランゲージであることを考えると、あれこれ装飾できない方がMarkdownの思想としては正統な気もします。
今回は以上です。
それでは！
