AsciiDoctorでcoderayを使いシンタックスハイライトする

色々と雑だが、なんとかできた。

開発環境

• LinuxMint 17.3 MATE 32bit
  • rbenv
    • Ruby 2.4.0
      • gem
        • AsciiDoctor
        • coderay 1.1.1

ハイライト

before	after

コードおかしいけど。

前回まで

• SynapticパッケージマネージャでAsciiDocをインストールしようとするも1.12GBなのでやめた

Ruby環境を整えてAsciiDoctorインストール

• rbenvとruby-buildとRuby2.4.0をインストールする
  • AsciiDoctorをインストールする
    • plumaにAsciiDocのシンタックスハイライトを設定した

$ bash -l
$ rbenv exec asciidoctor test.adoc

test.htmlが出力される。

課題

• ソースコードのシンタックスハイライトができていない
• styleタグがウザい
• 謎のタグができる
  • <span id="author"
  • <span id="revdate"
• その他にもstyle用の余計なタグができる

シンタックスハイライトしたい

参考

AsciiDocによる継続的ドキュメント開発〜１．インストールと基本的な使い方 - dackdive's blog

ハイライターの指定

http://asciidoctor.org/docs/asciidoc-syntax-quick-reference/#source-code

AsciiDoc内に以下の定義が必要。pygmentsの箇所には任意のハイライターを指定する。

:source-highlighter: pygments

ハイライター

• coderay
• highlightjs
• prettify
• pygments

AsciiDoctorはRuby製。ハイライターのうちいくつかはJS, Python製なのだが。どうやって連動する？さっぱりわからないが、以下が参考になる？

Pygments.rb を使う - Qiita

できるだけ不具合が生じるリスクは抑えたい。Ruby製のcoderayが無難か。

coderayのインストール

Rubyの仮想環境で2.4を有効化する。

$ ruby -v
ruby 1.9.3p484 (2013-11-22 revision 43786) [i686-linux]
$ bash -l
$ ruby -v
ruby 2.4.0p0 (2016-12-24 revision 57164) [i686-linux]

1回目(失敗)

gemインストール方法。

• はてなブログ用gemをインストールする(２回目)

$ sudo gem install coderay

Fetching: coderay-1.1.1.gem (100%)
Successfully installed coderay-1.1.1
1 gem installed
Installing ri documentation for coderay-1.1.1...
Installing RDoc documentation for coderay-1.1.1...

gem listで確認するも、なぜかcoderayが存在せず。

$ gem list

*** LOCAL GEMS ***

asciidoctor (1.5.5)
bigdecimal (default: 1.3.0)
did_you_mean (1.1.0)
hatenablog (0.5.0)
io-console (default: 0.4.6)
json (default: 2.0.2)
mini_portile2 (2.1.0)
minitest (5.10.1)
net-telnet (0.1.1)
nokogiri (1.6.8.1)
oauth (0.4.7)
openssl (default: 2.0.2)
power_assert (0.4.1)
psych (default: 2.2.2)
rake (12.0.0)
rdoc (default: 5.0.0)
test-unit (3.2.3)
xmlrpc (0.2.1)

2回目(失敗)

bash -lのかわりに以下を実行後sudo gem install coderayを実行するも同様。

$ source ~/.bash_profile

3回目(成功)

手順が間違っていたらしい。AsciiDoctorをインストールするによると以下。

$ rbenv exec gem install coderay

覚えられないよこんなの…。

$ rbenv exec gem install coderay
Fetching: coderay-1.1.1.gem (100%)
Successfully installed coderay-1.1.1
invalid options: -SNw2
(invalid options are ignored)
Parsing documentation for coderay-1.1.1
Installing ri documentation for coderay-1.1.1
Done installing documentation for coderay after 7 seconds
1 gem installed

coderayがインストールされたことを確認した。

$ rbenv exec gem list

*** LOCAL GEMS ***

asciidoctor (1.5.5)
bigdecimal (default: 1.3.0)
coderay (1.1.1)
did_you_mean (1.1.0)
hatenablog (0.5.0)
io-console (default: 0.4.6)
json (default: 2.0.2)
mini_portile2 (2.1.0)
minitest (5.10.1)
net-telnet (0.1.1)
nokogiri (1.6.8.1)
oauth (0.4.7)
openssl (default: 2.0.2)
power_assert (0.4.1)
psych (default: 2.2.2)
rake (12.0.0)
rdoc (default: 5.0.0)
test-unit (3.2.3)
xmlrpc (0.2.1)

AsciiDocファイルにハイライターを設定する

:source-highlighter: coderay

ファイルの先頭に。

AsciiDocファイルをHTMLに変換する

$ bash -l
$ rbenv exec asciidoctor test.adoc

test.htmlを出力する。

ハイライトされた！

ブラウザで表示確認。OK。

before	after

所感

環境構築とその周辺ツール利用のむずかしさを感じた。そろそろまとめないと辛い。