HakyllからHugoに移行した

移行理由

前はHakyll+pandocでorg-modeで書く→htmlに変換してgithub pagesで公開という手順を踏んでいたのだけれど、pandocのorg-mode対応が中途半端すぎて、対応していない記法があったりcode block(こういうの)の中で特殊な記号を使うと上手くパース出来なかったりして色々厳しくなってきていたというのが理由。 困ってたところにhugoというのを教えてもらったのでそれに移行することにした。

手順諸々

導入

hugoをsnapdから入れて使う。テストサイトを作って挙動を確認してから必要なものをsourceブランチに持ってきて導入はおしまい。 各記事はfront matterを少し書きなおすだけ。ありがたいことにorg-modeでかく場合は大体似たような文法なのでちょこっと書き換えるだけで動く。

hugo serve --watch --buildDrafts でドラフトも見れるようにできるので、ドラフト確認してOKならhugoからpublishするというのが正しいフローっぽい。

テーマ

Hakyllの時からテーマは自作していたのでテンプレートのカスタマイズとcssを持ってくるみたいな作業が必要になったのでやった。 hugo new theme [テーマ名] で必要なファイル群が themes にできるのであとは Templates にテンプレートの公式ドキュメントがあるのでそれとかhugoの実際のテンプレートを見てカスタマイズをした。

まぁ変に汎用性とか気にしなければ簡単、だと思う。

コードのsyntax highlight

config.tomlに

  pygmentscodefences = true
  pygmentsstyle = "manni"

と書いた。 pygmentscodefencesはmarkdownで ```lang みたいに書けるようにするやつだけど、org-modeのcode blockもありがたいことに対応してくれてたのでそのまま色がついた。

カラースキームはPygmentsの公式サイトから色々試してしっくり来るやつを探すと良さそう。

syntax highlight関係のデザイン

pandocではsyntax highlight用にcssを用意して色を指定していたんだけどそれが不要になった。 それと、pygmentsstyleで色をつけるとpreの背景の色を強制的に指定されてしまうので今までは色をつけてたんだけどそれを外した(文章中のcodeはそのままにしてる)。

TOC

困ったことにorg-modeだとtocが表示されないバグがあるらしく1、調べたらテンプレートだけでTOCを作る方法があったのでそれをパクった。 リストを作ってCSSでheadingに応じて右にずらしているだけだけど。

semantic-uiの読み込み

このブログではsemantic-uiをcssフレームワークとして使っていて、できればそれらのファイルを自分のリポジトリに含めてcommitするのは避けたかったのでsubmoduleで頑張った。 と言っても git submodule add URL directory とかして管理するだけだけど。 公開するときとローカルビルドするときのどちらも必要になるのでどちらもsubmoduleに追加する必要がある。 それと、URLはgit@…じゃなくてhttps:… じゃないとだめらしい。(一度怒られた)

hard line breaks

これはやり方がわからない。 orgで書いた時に、パラグラフ中の改行はHTMLで強制改行に(<br> に)してほしい。 #+OPTIONS: \n:t 相当のやつ。markdownは対応しているみたいだけど…。

一度pandocでhard line breaks入れるフィルターを通すとかすると良いのかもしれないけど強引すぎるからやりたくはない。 hugoが対応してくれるのを待つしかないのかな〜。


1

2017-11-10現在。最近報告されたらしいのでそのうち直ると思う。