No.77
【Markdown】MDファイルのHTML化
MDファイルをHTMLファイルにしたい
最近MDでマニュアルなどを書くことが多いのだが、困るのはMDを見れない環境の人に見せなくてはならないケースだ。
GithubとかMDをHTML化して表示してくれるサイトにアップロードできるとか、Chromeに拡張プラグイン入れてくれとか言えれば気が楽なのだが、NDAだったり相手のスキルだったりでそうもいかない時が多い。
そういうときはPandocを使ってファイルをHTML化してしまおう。
オプション指定により、CSSファイルなどを全てData URIスキームにして埋め込んでくれる。すごい便利。
Pandocのインストールと変換方法
※下記はWindows7環境での手順。
①Pandocのインストール
下記から最新のreleaseを閲覧する。
それぞれのDownload項目から
pandoc-リリースタグ-windows.msi
というインストーラーをダウンロードし実行する。
②環境設定
Pandocは自分でパスを通してくれないので手動で環境変数に追加してやる必要がある。
「コンパネ＞システム」から「システムの詳細設定」を開く。
「環境変数」をクリックし、システム環境変数のPathに下記のパスを追加する。セミコロンは適宜追加のこと。
C:\Users\ユーザー名\AppData\Local\Pandoc
③変換実行
HTMLファイルへの変換はコマンドラインで行う。
以下のコマンドを実行してHTMLファイルに変換する。ポイントはCSSファイルなどをData URIスキームで埋め込んでくれる--self-containedオプション。
pandoc 入力MDファイル名 -s --self-contained -t html5 -c CSSファイル名 -o 出力HTMLファイル名
以下はZドライブ直下に全ファイルを用意して行った場合のサンプル。
pandoc Z:\sample.md -s --self-contained -t html5 -c Z:\sample.css -o Z:\sample.html
Github風味のcss
仕事柄、GithubのMDビュワーと同じように表示してもらえるとありがたいことが多い。
その場合は下記のサイトで公開しているcssを使用させてもらっている。
補足
Pandocは様々な形式にデータ変換を行えるので、ぜひ色々試したい。