静的サイトジェネレータの Hexo を使ってみる
Node.js 製の静的サイトジェネレータ、Hexo を使ってみた。Gatsby.js が覇権を握るまでは、Ruby に抵抗がなければ GitHub Pages でも使われている Jekyll か、フロントエンドエンジニアなら慣れ親しんだ Node.js だけで扱える Hexo か、という感じで人気だったと思う。
# Hexo CLI をインストールする
$ npm install -g hexo-cli
# Hexo CLI でプロジェクトを作成する
$ hexo init example
INFO Cloning hexo-starter https://github.com/hexojs/hexo-starter.git
INFO Install dependencies
added 185 packages from 430 contributors and audited 191 packages in 10.455s
13 packages are looking for funding
run `npm fund` for details
found 0 vulnerabilities
INFO Start blogging with Hexo!
# 生成されたディレクトリやファイルを見てみる
$ tree -d -I node_modules ./example
./example
├── _config.yml
├── package.json
├── scaffolds/
│ ├── draft.md
│ ├── page.md
│ └── post.md
├── source/
│ └── _posts/
│ └── hello-world.md
└── themes/
└── landscape/
├── package.json
├── languages/
├── layout/
│ ├── _partial/
│ │ └── post/
│ └── _widget/
├── scripts/
└── source/
├── css/
│ ├── _partial/
│ ├── _util/
│ ├── fonts
│ └── images/
├── fancybox/
│ └── helpers/
└── js/
# とりあえずスターターのサイトを眺めてみる
$ cd ./example/
$ npm run server
> hexo-site@0.0.0 server /Users/Neo/example
> hexo server
INFO Validating config
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.
…とまぁこんな感じで、とりあえず簡単に http://localhost:4000/ が起動して、Hexo 製のブログが閲覧できた。
package.jsonを見ると、Hexo 関連の npm パッケージにのみ依存している_config.ymlが全ての設定を司るファイルのようだ。サイト名や URL、ディレクトリの指定からシンタックスハイライト機能の設定に至るまで、ココで殆どが管理されている_config.yml内のthemeで、サイトのテーマを指定している。デフォルトのlandscapeテーマ (./themes/landscape/) は、コレはコレでプロジェクト配下に別の Node.js プロジェクトを抱えたような形になるらしく、テーマ用のpackage.jsonが確認できる。テーマを自作するのはちょっと大変そう…./scaffolds/配下の Markdown ファイルが雛形になる様子。Front Matter と呼ばれるメタデータを YAML 形式で書く仕組みと、Mustache のようなプレースホルダが確認できる./source/_posts/hello-world.mdが、先程開発サーバで確認したブログ記事にあたる。Front Matter と Markdown で構成されている./source/配下のディレクトリ名が./scaffolds/配下の Markdown ファイル名と揃っていて、Front Matter 部分はテンプレートで定義してある感じかな
$ hexo new page コマンドで新規固定ページを作ったり、$ hexo new draft で新規下書きを作ったりして、記事を書いていくみたい。
テンプレートは豊富で、とりあえず規制のデザインで良ければ簡単にブログサイトが作れそう。
_config.yml がデカすぎて、独自の用法をいけないのが辛かったのと、テーマを自作したりするのが大変そうだったので断念した。今回自分が欲しかった、かるーい感じの静的サイトジェネレータではなかったので…。