39Si

プログラミング関連の勉強した内容を簡単にまとめておきます

Markdown を HTML に変換【Python3】

Python3 で Markdown ファイルを HTML に変換する

hatena ブログを書き始めた時に知った Markdown ですが、とても気にいっていろんなファイルを Markdown 形式で作っています。
今回は、 Markdown から HTML への変換を Python で行いました。
Python で変換するモジュールは色々あると思いますが、 今回は markdown, markdown2, gfm の3つを試してみました。

環境

Markdown ファイル

今回、変換する Markdown ファイルは以下のものを使用した。
Markdown のファイル中の 「{ ``` }」はバッククオート三つです。 hatena の Markdown 記法ではうまく表示できなかったのでこのような形に変更している。

input.md

# 見出し1
## 見出し2

1. 番号付きのリスト
2. **太字**
3. _イタリック_
    - リスト

## Code1

    # code sample
    str = 'Hello world!'

    print(str)

## Code2

{ ``` }
# code sample
str = 'Hello world!'

print(str)
{ ``` }

## Link
[Github Flavored Markdown](https://www.google.com)

## Image
![Image file](hoge.png)

markdown モジュール

ソースコード

# markdown
import markdown

# markdown file の読み込み
f = open('input.md', 'r', encoding='utf-8')
text_md = f.read()
f.close()

# markdown file -> html file
md = markdown.Markdown()
html = md.convert(text_md)

print(html)

実行結果

<h1>見出し1</h1>
<h2>見出し2</h2>
<ol>
<li>番号付きのリスト</li>
<li><strong>太字</strong></li>
<li><em>イタリック</em><ul>
<li>リスト</li>
</ul>
</li>
</ol>
<h2>Code1</h2>
<pre><code># code sample
str = 'Hello world!'

print(str)
</code></pre>
<h2>Code2</h2>
<p>```</p>
<h1>code sample</h1>
<p>str = 'Hello world!'</p>
<p>print(str)[改行]```</p>
<h2>Link</h2>
<p><a href="https://www.google.com">Github Flavored Markdown</a></p>
<h2>Image</h2>
<p><img alt="Image file" src="hoge.png" /></p>

※ 上の中の[改行]は改行が入ってます。

参考ページ

Python で Github Flavored Markdown をレンダリングする - tototoshi の日記

markdown2 モジュール

import markdown2

# markdown file の読み込み
f = open('input.md', 'r', encoding='utf-8')
text_md = f.read()
f.close()

html = markdown2.markdown(text_md, extras=['fenced-code-blocks'])

print(html)

実行結果

<h1>見出し1</h1>

<h2>見出し2</h2>

<ol>
<li>番号付きのリスト</li>
<li><strong>太字</strong></li>
<li><em>イタリック</em>
<ul>
<li>リスト</li>
</ul></li>
</ol>

<h2>Code1</h2>

<pre><code># code sample
str = 'Hello world!'

print(str)
</code></pre>

<h2>Code2</h2>

<pre><code># code sample
str = 'Hello world!'

print(str)
</code></pre>

<h2>Link</h2>

<p><a href="https://www.google.com">Github Flavored Markdown</a></p>

<h2>Image</h2>

<p><img src="hoge.png" alt="Image file" /></p>

参考ページ

ブログ記事: Markdown の方言|ニモニク - 株式会社ニーモニック

Markdown 処理系の比較 - build error

gfm モジュール

ソースコード

# gfm module
import gfm

# markdown file の読み込み
f = open('input.md', 'r', encoding='utf-8')
text_md = f.read()
f.close()

# html = gfm.gfm(text_md)
html = gfm.markdown(text_md)
print(html)

実行結果

<h1>見出し1</h1>
<h2>見出し2</h2>
<ol>
<li>番号付きのリスト  </li>
<li><strong>太字</strong>  </li>
<li><em>イタリック</em>  <ul>
<li>リスト</li>
</ul>
</li>
</ol>
<h2>Code1</h2>
<pre><code># code sample
str = 'Hello world!'

print(str)
</code></pre>
<h2>Code2</h2>
<p>```</p>
<h1>code sample</h1>
<p>str = 'Hello world!'</p>
<p>print(str)<br />[改行]```</p>
<h2>Link</h2>
<p><a href="https://www.google.com">Github Flavored Markdown</a></p>
<h2>Image</h2>
<p><img alt="Image file" src="hoge.png" /></p>

※ 上の中の[改行]は改行が入ってます。

参考ページ

gfm 0.0.3 : Python Package Index

まとめ

3 つの Markdown のモジュールを簡単に試してみた。
一番差が出たのは 「```」による pre 記法の箇所でした。
もともと Markdown ではスペース4つやタブで行いますが、
自分はてななどではよく「```」をよく使うので、 個人的には markdown2 のモジュールが使いやすいように感じた。
細かいオプションなどもあるかもしれないが、 今回は簡単に使ってみてこのような結果になった。
以上。