Hugo のテーマである Docsy を使用してドキュメントを書く環境を整える。
CONTENTS
- Node.js のインストール
- Hugo セットアップ
- 必要なコンポーネントのインストール
- Docsy のインストール
- Docsy Example からコンテンツをコピー
- hugo server でコンテンツを確認
- まとめ
- 参考資料
SOURCES
ENVIRONMENTS
- Node.js : 12
- Hugo : 0.57.2
Node.js のインストール
Docsy には、PostCSS と Autoprefixer が必要。 このために Node.js も必要。
# exec as root export NODE_VERSION=12 curl -sL https://deb.nodesource.com/setup_$NODE_VERSION.x | bash - apt-get install -y nodejs npm install -g npm
Hugo セットアップ
まずは Hugo のセットアップを行う。 Getting Started : Docsy によると、最新の extended な Hugo が推奨とのこと。
ここでは 0.57.2 をインストールした。
export HUGO_VERSION=0.57.2
curl -L -o hugo.tar.gz https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_Linux-64bit.tar.gz
Hugo は Go 製のツールなので、ダウンロードしてパスを通せば使える。
以下のコマンドで ./docs にサイトの雛形が作成される。
hugo new site docs
今後は ./docs ディレクトリで作業を行う。
必要なコンポーネントのインストール
PostCSS と Autoprefixer をインストールする。
npm install --save-dev postcss-cli npm install --save-dev autoprefixer
また、textlint も入れておいた。
npm install --save-dev textlint npm install --save-dev textlint-rule-preset-ja-technical-writing
Docsy のインストール
Docsy はサブモジュールとしてインストールした。
git init git submodule add https://github.com/google/docsy.git themes/docsy git submodule update --init --recursive
Docsy Example からコンテンツをコピー
Docsy はサンプルサイトが用意されている。 ソースは google/docsy-example にあるので、ここから必要なコンテンツをコピーする。
とりあえず以下をコピーした。
- config.toml - content - blog - docs - about - _index.html - featured-background.jpg - search.md
hugo server でコンテンツを確認
hugo server コマンドで web サーバーを起動できる。
live reload もやってくれる。
hugo server
これでコンテンツを作成する準備が整った。 ドキュメントを見つつ、コンテンツを追加していこう。
まとめ
これで Hugo を使用してドキュメントを書く準備が整った。 ページの書き方の詳細はドキュメントにまとまっているので、これを参照しつつドキュメントを書いていける。
