azukipochette's weblog

memory dump (mini)

PowerShell を使用して Markdown を GitHub 風の HTML ファイルとして出力する (シンタックス ハイライト対応版)

以前の記事で PowerShell 6 以降で使用可能なコマンドレットを使用して Markdown ファイルを GitHub で表示した場合のような HTML ファイルを生成する方法を書いた。

azukipochette.hatenablog.com

この時のスクリプトでは、Markdown を利用して記述するメリットの一つであるシンタックスハイライト対応をしていなかったので、対応したバージョンを以下に掲載する。

$mdfile = "C:\path\to\yourmarkdownfile.md"
ConvertTo-Html -Body ('<div class="markdown-body">' + (ConvertFrom-Markdown -Path $mdfile).Html + '</div>')  -Head '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/github-markdown-css/5.1.0/github-markdown.min.css"><link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/styles/github.min.css"><script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.5.1/highlight.min.js"></script><script>hljs.highlightAll();</script>' | Out-File -FilePath out.html

対応方法は簡単で、highlight.js を呼び出せば良い。
今回は、タイトル通り GitHub 風のスタイルを選択しているが、他にも様々なスタイルが用意されているので、好みに合わせて選択すると良い。

highlightjs.org

おまけ

PDF 印刷を行うとコード 部分が期待通りに表示されないことがある(水平スクロール バーが表示されてコード全体が正しく表示された状態で印刷されない)。 この場合は、下記の CSS を追記するとよい。

<style type="text/css">
 .markdown-body pre code { white-space: pre-wrap; overflow: hidden; }
</style>