shigeki.takeguchi.log

アラフィフおじさんの技術日記

MiddlemanからHexoへ乗り換えた話(なぜHexoにしたのか)

Middlemanから移行にあたって検討した静的サイトジェネレーター

2015年にWordpressとホスティングサービスを捨ててGitHubページを使ってMiddleman(静的サイトジェネレーター)でブログを運用してきたわけですが、Rubyをベースにしているからか、それとも他に原因があるからかわかりませんがけっこうな割合でMiddlemanが起動できなくなるってのを経験してきました。
その度に依存パッケージをbundle installとかで入れ替えたりして対応してましたが、そろそろMiddlemanから他の静的サイトジェネレーターに替えた方が良いのかなーということでいろいろ調べました。
このStaticGenなどをチェックしているとMiddleman人気落ちてきてる?前ほど使われてない?っていう感じなので思い切って移行してしまうことにしました。

というわけでReact.jsベースのものだと

Vue.jsベースだと

などを試してみました。 どれもそれぞれにいいところ、ちょっとまだブログをやるにはどうなの?的なこともありMiddlemanからの移行がやりやすそうなHexoにしました。

HexoはNode.jsベースなのでフロントエンド的にはやりやすそうでMarkdownも移行しやすそう。

Hexo

他の静的サイトジェネレターはファイルパスがMiddlemanの時と変わってしまうことがわかって、検索エンジン的にちょっと採用できないなとなりました。 Middlemanが日付をベースに最後のファイル名がMarkdownファイルの名称になるのに、例えば2018-01-31-1.mdのようなファイル名にするとURLがxxxx.github.io/2018/01/31/1.htmlになるわけですがなかなか、そんなファイルパスにしてくれるものがなかったりしました。
そうなったらまぁリダイレクトなりすればMiddlemanでのファイルパスと新規に採用したフレームワークのファイルパスが引き継げるわけですがそれなりに記事もあったため、それはかなり面倒だってなりました。

といった感じでHexoにしましたが目下の悩みはhot-reloadができないってことくらいです。
なぜかhexo-livereloadhexo-browsersyncがうまく動いてくれません。
これはまぁ毎回ファイルを更新したらブラウザを自力でリロードしないといけなくて、今さらな感じで面倒だったりしますね。なんとか解消できないものか思案中です。

ちなみにpackage.jsonはこんな感じです。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
{
"name": "hexo-site",
"version": "0.0.0",
"private": true,
"hexo": {
"version": "3.7.1"
},
"dependencies": {
"hexo": "^3.2.0",
"hexo-autoprefixer": "^1.0.0",
"hexo-deployer-git": "^0.3.1",
"hexo-generator-archive": "^0.1.4",
"hexo-generator-category": "^0.1.3",
"hexo-generator-feed": "^1.2.2",
"hexo-generator-index": "^0.2.0",
"hexo-generator-sitemap": "^1.2.0",
"hexo-generator-tag": "^0.2.0",
"hexo-renderer-ejs": "^0.3.0",
"hexo-renderer-marked": "^0.3.0",
"hexo-renderer-scss": "^1.2.0",
"hexo-renderer-stylus": "^0.3.1",
"hexo-server": "^0.2.0",
"hexo-tag-bootstrap": "^0.1.2",
"hexo-tag-fontawesome": "^1.0.0"
},
"devDependencies": {}
}

shigeki.takeguchi

渋谷の某ソーシャルゲームの会社でフロントエンドエンジニアとして働いてます。20世紀よりウェブ業界。気づいたらアラフィフ業界人です。
まだまだ現場で粘り強く作る側でいたいと思います。