基本的な使用方法

インストールをテストする

Hugo を インストール した後で、正しくインストールされたかどうかを以下のコマンドで確認します。

hugo version

以下のようなものが表示されるはずです。

hugo v0.105.0-0e3b42b4a9bdeb4d866210819fc6ddcf51582ffa+extended linux/amd64 BuildDate=2022-10-28T12:29:05Z VendorInfo=snap:0.105.0

利用可能なコマンドを表示する

使用可能なコマンドとフラグのリストを表示するには、以下のコマンドを実行します。

hugo help

サブコマンドのヘルプを表示するには、--help フラグを使用します。 たとえば、以下のコマンドです。

hugo server --help

サイトをビルドする

サイトをビルドするには、プロジェクト ディレクトリに cd して、以下のコマンドを実行します。

hugo

hugo コマンドはサイトをビルドし、ファイルを public ディレクトリに公開します。 サイトを別のディレクトリに公開するには、--destination フラグを使用するか、サイトの設定で publishDir を設定します。

下書き、公開予定、期限切れのコンテンツ

Hugo では、コンテンツの フロントマター に draft や publishdate、さらには expirydate を設定できます。デフォルトでは、Hugo は以下のコンテンツを公開しません。

• draft 値が true (下書き)
• date が将来の日付 (公開予定)
• publishDate が将来の日付 (公開予定)
• expiryDate が過去の日付 (期限切れ)

以下のコマンドライン フラグを使用して、hugo または hugo server を実行するときにデフォルトの動作をオーバーライドできます。

hugo --buildDrafts    # または -D
hugo --buildExpired   # または -E
hugo --buildFuture    # または -F

これらの値はサイトの設定で設定することもできますが、すべてのコンテンツ作成者がその設定を認識し、理解しない限り、望ましくない結果を招く可能性があります。

サイトの開発とテスト

レイアウトの開発中またはコンテンツの作成中にサイトを表示するには、プロジェクト ディレクトリに cd して以下のコマンドを実行します。

hugo server

hugo server コマンドはサイトをメモリ上に構築し、最小限の HTTP サーバを使用してページを提供します。 hugo server を実行すると、ローカルサイトの URL が表示されます。

Web Server is available at http://localhost:1313/ 

サーバーの実行中、サーバーはプロジェクト ディレクトリを監視して、アセット、設定、コンテンツ、データ、レイアウト、翻訳、および静的ファイルへの変更を監視します。 変更を検出すると、サーバーはサイトをリビルドし、LiveReload  を使用してブラウザを更新します。

ほとんどの Hugo のビルドは非常に高速なので、ブラウザを直視していないと変化に気づかないかもしれません。

LiveReload

サーバーの実行中に、Hugo は生成された HTML ページに JavaScript を挿入します。 LiveReload スクリプトは、Web ソケットを介してブラウザからサーバーへの接続を作成します。 ソフトウェアやブラウザ プラグインをインストールする必要はなく、設定も必要ありません。

自動リダイレクト

コンテンツを編集する際、最後に変更したページにブラウザーを自動的にリダイレクトする場合は、以下のコマンドを実行します。

hugo server --navigateToChanged

サイトをデプロイする

サイトをデプロイする準備ができたら、以下のコマンドを実行します。

hugo

これにより、サイトがビルドされ、ファイルが public ディレクトリに公開されます。 ディレクトリ構造は、以下のようになります。

public/
├── categories/
│   ├── index.html
│   └── index.xml  <-- RSS feed for this section
├── post/
│   ├── my-first-post/
│   │   └── index.html
│   ├── index.html
│   └── index.xml  <-- RSS feed for this section
├── tags/
│   ├── index.html
│   └── index.xml  <-- RSS feed for this section
├── index.html
├── index.xml      <-- RSS feed for the site
└── sitemap.xml

シンプルなホスティング環境では、通常ファイルを ftp や rsync 、あるいは scp して仮想ホストのルートに置くのですが、 必要なのは public ディレクトリの内容だけです。

多くのユーザーは、GitHub や GitLab のリポジトリにプッシュ ¹ することでビルドとデプロイを行う CI/CD ワークフローを使用してサイトをデプロイしています。人気のプロバイダーは、AWS Amplify  、CloudCannon  、Cloudflare Pages  、GitHub Pages  、GitLab Pages  、Netlify  などがあります。

詳しくは、「ホスティングとデプロイメント」 のセクションを参照してください。