Markdownはとても便利ですが、専用のビューアーで表示しないと中々見づらいので、リテラシーが低めの方にドキュメントを共有する際にはHTMLの方が都合が良い場合があります。
そこで、コマンドラインから簡単にMarkdownからHTMLに変換できるツールのPandocを使ってみました。
Pandocとは
Markdownなどのドキュメントファイルを別のフォーマットに変換できるツール。
Markdown以外にも色々なフォーマットのファイルを変換できる。詳細は後述のドキュメントを参照。
ドキュメント
インストール
Pandoc公式サイトからインストーラーを入手して実行。
インストール後に以下を実行してインストールされているかを確認。
$ pandoc --version
MarkdownからHTMLに変換してみる
以下を実行するとMarkdownをHTMLに変換した文字列が標準出力される。
$ pandoc -f markdown -t html ".mdファイルのパス"
# 例: pandoc -f markdown -t html ./README.md
実際にHTMLファイルとして出力する場合は以下のように実行。
$ pandoc -f markdown -t html ".mdファイルのパス" > "出力先のパス"
# 例: pandoc -f markdown -t html ./README.md > ./README.html
これでHTMLファイルに変換されますが、スタイルがあまり整っていないのがちょっと残念。
出力したHTMLのスタイルを整形する
もし、変換後のHTMLファイルを整えたい場合は、CSSファイルを既存のテンプレートに適用する方法と、新たにテンプレートを作成する事で対応可能。
CSSを適用する場合は、以下のように-c
オプションでCSSを指定するだけでOK。
$ pandoc -f markdown -t html -c ./example.css ./README.md > ./README.html
テンプレートをカスタマイズする
事前準備
まずは事前準備としてユーザーディレクトリに.pandocディレクトリを作成。
ユーザーディレクトリが不明の場合はpandoc --version
を実行すると"Default user data directory: "という部分にパスが表示されるのでそれを参照。
$ mkdir -p ~/.pandoc/templates
$ cd ~/.pandoc/templates
テンプレート生成
$ pandoc -D html5 > mytemplate.html
このmytemplate.htmlを好きな形に編集する。
テンプレートを適用
以下のように--template
オプションでテンプレート用htmlファイルを指定する。
$ pandoc -f markdown -t html --template=mytemplate ./README.md > ./README.html
因みにGithubのスタイルをベースにしたPandoc用のテンプレートmd2html-template-for-pandocを作ったので、良かったらご利用ください。
※僕の場合はCSSファイルの依存を無くしたかったので、HTMLに直接styleを埋め込んでいます。