いきなりですが、質問です。
「ソースコードをhtmlで次のように表示できますか？」
エスケープ処理への対策を考えないとダメでしょうね。
そこに色まで付けるとなると、かなり面倒な作業になります。
そのような面倒な作業をしたくない人は、Pygmentsを使いましょう。
本記事の内容
- Pygmentsとは？
- Pygmentsのシステム要件
- Pygmentsのインストール
- Pygmentsの動作確認
それでは、上記に沿って解説していきます。
Pygmentsとは？
Pygmentsとは、ソースコードを綺麗に表示するためのシンタックスハイライターです。
Pygmentsの使い方は、以下の2つがあります。
- ライブラリ（Python API）
- コマンドラインツール
Pygmentsが対応している言語は、500以上あります。
有名どころを下記に記載しておきます。
- C/C++
- Java
- PHP
- JavaScript
- Python
- HTML
- CSS
- SQL
詳細を知りたい方は、以下のURLで見てみてください。
https://pygments.org/languages/
以上、Pygmentsについてざっくりと説明しました。
次は、Pygmentsのシステム要件を確認します。
Pygmentsのシステム要件
現時点（2021年4月5日）でのPygmentsの最新バージョンは、2.8.1となります。
この最新バージョンは、2021年3月7日にリリースされています。
サポートOSに関しては、以下を含むクロスプラットフォーム対応です。
- Windows
- macOS
- Linux
そして、サポート対象となるPythonのバージョンはPython 3.5以降です。
新しいバージョンのPythonなら、OKということでしょう。
今回は、現時点では最新（2021年4月2日リリース）のPythonを使っています。
今回は、現時点では最新（2021年4月2日リリース）のPythonを使っています。 >python -V Python 3.9.3
Pygmentsのシステム要件は、Pythonのバージョンにだけ気を付けましょう。
それ以外は、注意すべきことはありません。
以上、Pygmentsのシステム要件の説明でした。
次は、Pygmentsのインストールを行います。
Pygmentsのインストール
最初に、現状のインストール済みパッケージを確認しておきます。
>pip list Package Version ---------- ------- pip 21.0.1 setuptools 54.2.0
次にするべきことは、pip自体の更新です。
pipコマンドを使う場合、常に以下のコマンドを実行しておきましょう。
python -m pip install --upgrade pip
では、Pygmentsのインストールです。
Pygmentsのインストールは、以下のコマンドとなります。
pip install Pygments
インストールは、一瞬で終わります。
では、どんなパッケージがインストールされたのかを確認しましょう。
>pip list Package Version ---------- ------- pip 21.0.1 Pygments 2.8.1 setuptools 54.2.0
Pygmentsは、他に依存しているパッケージがありません。
そのため、どんな環境でにも簡単に導入できそうです。
以上、Pygmentsのインストールの説明でした。
最後は、Pygmentsの動作確認を行います。
Pygmentsの動作確認
Pygmentsには、以下の二つの使い方がありました。
- ライブラリ（Python API）
- コマンドラインツール
それぞれを下記で説明します。
ライブラリ（Python API）
公式サイト
https://pygments.org/
公式サイトのサンプルコードは、以下。
from pygments import highlight from pygments.lexers import PythonLexer from pygments.formatters import HtmlFormatter code = 'print "Hello World"' print(highlight(code, PythonLexer(), HtmlFormatter()))
でも、これは動きません。
おそらく、公式サイトが更新されていないのでしょう。
動くコードは、以下となります。
from pygments import highlight from pygments.lexers.python import Python3Lexer from pygments.formatters.html import HtmlFormatter code = 'print "Hello World"' print(highlight(code, Python3Lexer(), HtmlFormatter()))
上記プログラムを実行すると、以下が表示されます。
<div class="highlight"><pre><span></span><span class="nb">print</span> <span class="s2">"Hello World"</span> </pre></div>
プログラムの内容は、字句解析とフォーマッターが理解できれば簡単です。
字句解析は、どの言語について解釈するのかということです。
今回は、Pythonのソースコードが対象になります。
フォーマッターは、変換したい形式のことですね。
ここでは、Pythonのソースコードをhtml形式に変換させようとしています。
コマンドラインツール
まず、ソースコードを用意します。
PythonでもPHPでもJavaでもなんでもいいです。
sample.py
import datetime
dt = datetime.datetime.now()
print(dt.strftime('%Y年%m月%d日 %H:%M:%S'))
次に、コマンドプロンプトなどのターミナルを起動します。
コマンドを実行できれば、なんでもいいです。
そして、sample.pyのある場所まで移動します。
ここでは、sample.pyのソースコードをhtmlファイルに変換しましょう。
pygmentize -f html -l python -o sample.html sample.py
上記コマンドを説明します。
「-f」は、フォーマッターの指定になります。
html形式にするために、「html」を指定しています。
「-l」は、字句解析の指定になります。
PYthonのソースコードであるから、「python」と指定しています。
「-o」は、出力ファイル名の指定です。
「sample.html」という名前で変換結果が保存されます。
上記コマンドの結果、sample.htmlが作成されます。
sample.html
<div class="highlight"><pre><span></span><span class="kn">import</span> <span class="nn">datetime</span> <span class="n">dt</span> <span class="o">=</span> <span class="n">datetime</span><span class="o">.</span><span class="n">datetime</span><span class="o">.</span><span class="n">now</span><span class="p">()</span> <span class="nb">print</span><span class="p">(</span><span class="n">dt</span><span class="o">.</span><span class="n">strftime</span><span class="p">(</span><span class="s1">'%Y年%m月</span><span class="si">%d</span><span class="s1">日 %H:%M:%S'</span><span class="p">))</span> </pre></div>
ただ、これを単純に表示するだけでは意味がありません。
CSSを読み込む必要があります。
そのCSSは、以下のコマンドで作成できます。
pygmentize -S default -f html > sample.css
「-S」は、cssのパターンを指定できます。
以下のパターンが用意されています。
- default
- emacs
- friendly
- colorful
なお、パターンを自作することも可能です。
これまでの作業で、ソースコードをhtmlで綺麗に表示することが可能です。
ただ、もっと楽したい人がいるかもしれません。
その場合は、以下のコードを実行してください。
pygmentize -f html -l python -O full -o full_sample.html sample.py
「-O full」を追加した実行すると、そのままアップ可能なhtmlファイルが作成されます。
以下URLは、full_sample.htmlをそのままアップしたものです。
