はじめに
こんにちは!
早速ですが、今日からのんびりとVSCode+Hugo+GitHubでブログを作る方法について書いていこうと思います。
長くなる気がしますので、今日はとりあえずHugoがインストールできれば良しということにしましょう。
それでは、よろしくお願いします!
対象
- Windows環境でHugoを使いたい方
前提
- Windowsな環境であること
- GitとVSCodeをインストールしていること
- まだな方は、こちらの記事を参考にインストールしてください。
- GitHubとの連携まで済ませておいてください。
Hugoのインストール
Hugoをインストールします。
が、Hugoには複数エディション・複数のインストール方法があることを抑えておかなければなりません。
エディションについて
公式のドキュメント次の通り
Editions
Hugo is available in two editions: standard and extended. With the extended edition you can:
- Encode to the WebP format when processing images. You can decode WebP images with either edition.
- Transpile Sass to CSS using the embedded LibSass transpiler. The extended edition is not required to use the Dart Sass transpiler.
We recommend that you install the extended edition.
これを雑に翻訳するとこんな感じ
エディション
Hugoには、標準版と拡張版の2つのエディションがあります。拡張版では以下のことが可能です:
- 画像を処理する際、WebP形式にエンコードできます。どちらのエディションでもWebP画像をデコードできます。
- 組み込みのLibSassトランスパイラを使用して、SassをCSSにトランスパイルします。Dart Sassトランスパイラを使用するには、拡張エディションは必要ありません。
拡張版のインストールをお勧めします。
ということなので、今回は拡張版を用いることにしましょう。
インストール方法について
Hugoのインストール方法は複数存在しています。なお、新しめのHugoを使うためにはWindows 10ないしWindows Server 2016以降のOSが必要らしいです。
で、インストール方法は大きく分けて3つです。
- GitHubから最新のビルドをダウンロードしてインストール
- パッケージマネージャを使う
- ソースコードからビルド
結論から言うと、私はパッケージマネージャを使用しました。ですが、GitHubから最新のビルドをダウンロードしてインストールする方法も試しましたので一応記しておきます。
GitHubから最新のビルドをダウンロードしてインストールする
- HugoのGitHubリポジトリにアクセス
- 使用しているシステムに適合したファイルをダウンロード
- 大抵はhugo_extended_X.XXX.X_windows-amd64.zipをダウンロードすることになると思います。
- 展開
C:\Program Files\Hugoにhugo.exeを配置する- タスクバーにある検索ボックスなどから”システムの詳細設定を表示”を起動する
- “環境変数"の設定に入り、ディレクトリ
C:\Program Files\Hugoを環境変数に追加する - PowerShell等で
hugo versionを実行する- バージョンが表示されたらインストール成功です
本来ならこれでインストールが完了しているはずです。が、私の場合どうしてもcd C:\Program Files\Hugoを実行しない限りhugo versionが通らなかったので別の方法を試すことにしました。
まぁ例のごとくウイルスバスター君が悪さをしている気もしますが…
パッケージマネージャを使ってインストール
公式のドキュメントには、Chocolatey、Scoop、Wingetを用いてインストールする方法が書かれています。今回はなんとなくChocolateyを使うことにしました。まぁ、Wingetを使える状態の方も多いと思いますので、使えるならそっちでいいと思います。
- Chocolateyをインストール
- すでにインストールしている方は必要ありません。
- インストールしていない方はこちらの記事を参考にインストールしてください。
- PowerShell等で
choco install hugo-extendedを実行する - 完了したら
hugo versionを実行する- バージョンが表示されたらインストール成功です
この方法を使用したら普通に使うことができるようになりました。
まとめ
とりあえずHugoをインストールすることができました。よかったですね!
次回はとりあえずHugoでブログサイトを作成し、最低限設定を済ませるところまで行きたいと思います。
それでは、また次回!
参考文献
- 公式のドキュメント
https://gohugo.io/installation/windows/- 英語ですが簡潔にまとまっています