中国語公式サイト：hexo
hexo のインストール#
前提条件：
# ソースを切り替え、以降cnpmでパッケージをインストールする際に使用します。正常にパッケージをインストールできない場合に使用できます。
npm install -g cnpm --registry=https://registry.npmmirror.com
cnpm install hexo-cil -g
hexo init blog # 現在のディレクトリにblogディレクトリを作成します
cd blog
cnpm install
hexo server # 短縮形は hexo s
ブラウザにlocalhost:4000と入力すると、ブログが開発モードで正常に動作しているのが見えます。
hexo の設定#
ルートディレクトリの_.config.ymファイルに、以下の内容を設定します：
# サイト
title: 菜小牛のBlog # サイトタイトル
subtitle: 真のマスターは常に徒弟の心を持っている # サイトサブタイトル
description: 菜小牛のブログ # サイトの説明、主にSEOに使用されます
keywords: 菜小牛 Cirry # サイトのキーワード。複数のキーワードをサポート
author: Cirry # あなたの名前
language: ja-JP # 日本語に設定
timezone: 'Asia/Tokyo' # 国内のタイムゾーンに変更
# URL
## ここにサイトのURLを設定します。例えば、GitHubページを使用する場合、urlを'https://username.github.io/project'に設定します。
url: http://cirry.cn # あなたのブログのアドレスに変更
...
highlight: # コードハイライトを有効にする
enable: true
line_number: true
auto_detect: true
...
mathjax: true # これを追加して、数式サポートを有効にします。対応する記事でもmathjaxサポートを有効にする必要があります
他のパラメータは変更する必要はなく、保存後にhexo serverを再実行する必要があります（もちろんnpm run serverを使用してアプリを再起動することもできます）。ページを更新すると最新の効果が見られます。
基本コマンド#
| コマンド | 使用方法 | コマンド参考 | 説明 |
|---|---|---|---|
| init | hexo init [folder] | hexo init blog | ブログプロジェクトを初期化します。作成時にのみ使用します。 |
| new | hexo new [layout] <title> | hexo new post "hello" | 新しいブログ記事を作成します。source/_posts ディレクトリに hello.md という名前のファイルを新規作成します。 |
| generate | hexo generate | hexo g | 静的ファイルを生成します。 |
| publish | hexo publish [layout] <filename> | hexo publish post "hello" | 下書きを公開します。 |
| deploy | hexo deploy | hexo deploy | サイトをデプロイします。 |
| render | hexo render <file1> [file2] ... | ファイルをレンダリングします。 | |
| migrate | hexo migrate <type> | 他のブログシステムからのコンテンツ移行 | |
| clean | hexo clean | hexo clean | キャッシュファイル (db.json) と生成された静的ファイル (public) を削除します。 |
| list | hexo list <type> | サイトの資料をリストします。 | |
| version | hexo version | hexo version | Hexo のバージョンを表示します。 |
| hexo --draft | source/_draftsフォルダ内の下書き記事を表示します。 |
よく使うコマンドの例：
hexo new post --path hexo/hexo.md "hexo" # source/_posts/hexo/フォルダ内にhexo.md文書を作成し、タイトルは"hexo"になります。
hexo new page test # source/testファイル内にindex.md文書を作成します。
hexo new draft "草稿" # source/_draftsフォルダ内に草稿.mdを作成します。draftファイル内のファイルはページにレンダリングされません。
hexo new publish "草稿" # 草稿を_postsフォルダ内に公開します。publish後はページにレンダリングされます。
git でブログ記事を管理する#
まず、github、gitee、または自分で構築した git リポジトリに git リポジトリを作成できます。
リポジトリ作成後に表示されるコマンドに従ってコードをコミットできます。
git init
git add .
git commit -m "first commit"
git remote add origin [url] # あなたのリポジトリのurlアドレスに置き換えます。
git push -u origin master
git 基本コマンド#
| コマンド | 説明 |
|---|---|
| git pull | コードを更新します。 |
| git add . | コードをキャッシュに追加します。 |
| git commit -m "記事更新" | 説明を追加します。 |
| git push -u origin master | コードをリポジトリにコミットします。 |
上記のコマンドの順序に従って、正常にブログリポジトリをコミットおよび更新できます。
Maupassant テーマのインストール#
ここでは、デモ用に良いテーマMaupassantを見つけました。
git clone https://github.com/tufu9441/maupassant-hexo.git # 適切な場所にテーマコードをダウンロードします。
管理を容易にするために、ダウンロードしたファイル内の_config.ymlを_config.maupassant.ymlに名前変更し、ブログのルートディレクトリに置きます。以降はここでテーマを設定できます。なぜこのように操作するかは公式サイトのテーマ設定ファイルの使用を参照してください。
ダウンロードしたファイル内のlanguages、layout、sourceをブログのthemes/maupassantに移動します。対応するフォルダがない場合は作成します。
次に、テーマに必要な npm パッケージをインストールします：
cnpm install hexo-renderer-pug --save
cnpm install hexo-renderer-sass-next --save
テーマの設定#
_config.maupassant.ymlファイルで対応する属性を見つけます。
menu:
- page: home
directory: .
icon: fa-home
- page: archive
directory: archives/
icon: fa-archive
- page: about
directory: about/
icon: fa-user
- page: history
directory: timeline/
- page: guestbook
directory: guestbook/
icon: fa-comments
設定が完了したらプロジェクトを再起動し、プロジェクト内に「私について」や「ゲストブック」ページがないことに気づくでしょう。以下のコマンドを使用して作成できます：
hexo new page guestbook # ゲストブックページを作成します。
hexo new page about # 私についてページを作成します。
hexo new page history # タイムラインページを作成します。
注意：タイムラインページの内容は_config.maupassant.ymlのtimeline属性に記入します。また、タイムラインページのfront-matterは以下のようにする必要があります：
---
title: タイムライン
date: 2022-08-28 13:02:01
layout: timeline
comments: false
---
サイトアイコンの設定#
サイトの Favicon を設定するには、favicon.icoを Hexo のルートディレクトリのsourceフォルダに置きます。推奨サイズは 32px*32px です。
サイトに Apple デバイスのアイコンを追加するには、apple-touch-icon.pngという名前の画像を同じ場所に置きます。推奨サイズは 114px*114px です。
このサイトでアイコンのスタイルを確認できますfavicon-checkerが各ブラウザに適しているかどうかを確認します。
記事テンプレートの設定#
記事を作成するコマンドはhexo new post "hello"であることはすでに知っていますが、postというパラメータをどのように理解すればよいのでしょうか？
公式サイトでは、これをレイアウト（layout）として説明していますが、デフォルトでは_.config.ymlのdefault_layoutを代わりに使用します。私はこれを記事テンプレートとして理解する方が好きです。コマンドを使用して作成した記事の中には、すでにいくつかの内容が含まれています。この内容はどこから来るのでしょうか？
プロジェクトのルートディレクトリ内のscaffoldsフォルダを開くと、すでに 3 つのデフォルトファイルが存在します：draft.md、post.md、page.md。post.mdの内容をよく見ると、私たちが作成したhello.mdの内容と実際には同じです。
したがって、このフォルダにあるのは記事テンプレートであり、記事のタグ、カテゴリ、toc などの共通内容をカスタマイズするために使用できます。今後作成する記事にはこれらの内容が自動的に含まれます。post.mdを以下のように変更します：
title: {{ title }}
date: {{ date }}
tags:
category:
- []
mathjax: true
toc: true
注意：category は配列を使用でき、tags は直接タグを記述できます。例えば：tags: hexo blog、カスタムリンクアドレス permalink は/で終わる必要があります。例えば：permalink: /hexo/install/1/。
記事の要約#
ホームページにはデフォルトで記事の要約が表示され、全文は表示されません。記事のfront-matterにdescription:を記入して表示したい要約を設定するか、記事内容に<!--more-->を挿入して後の内容を隠すことができます。どちらも設定されていない場合、記事の最初の段落が自動的に要約として切り取られます。
hexo new post helloを使用して、hello.md 文書を新規作成し、内容は以下の通りです：
hello.md
---
title: hello
date: 2022-08-18 18:44:43
tags: hexo
toc: true
description: 現実について
mathjax: true
---
# こんにちは
またその言葉が出てきました。「重い」。未来の物事はなぜこんなに重いのでしょうか？ 地球の重力に問題があるのでしょうか？
## 世界
知識は金よりも価値があるかもしれず、ダガーよりも致命的かもしれません。
$$ f(x)=sin(x) + 12 $$
備考：title は記事のタイトル、toc は記事目次を有効にし、description は記事の要約内容、mathjax は数式サポートを有効にします。
保存して実行すると、記事が正常に表示され、スムーズに執筆できるようになります。
デプロイ#
デプロイのこの部分では、皆さんが以前に準備したサーバーを使用する必要があります。また、nginx や caddy などの他のリバースプロキシ web サービスがすでにインストールされている必要があります。面倒だと思う場合は、直接github pagesを使用してブログをデプロイすることもできます。具体的には# Hexo を GitHub Pages にデプロイするを参照してください。
hexo のデプロイ方法は多くありますが、今回は比較的簡単なデプロイ方法SFTPを選択します。後にもっと多くの人が必要とする場合は、drone 自動デプロイなどの他のデプロイ方法についても書くことができます。
ssh ツールを使用してサーバーに接続した後、まずユーザーと対応するブログディレクトリを作成します。
$ useradd -m -s /bin/bash hexo # ユーザーを作成します。
$ passwd hexo # パスワードを設定します。
# ログアウトして、hexoユーザーで再ログインします。
$ cd ~
$ mkdir blog # blogディレクトリを作成し、デプロイファイルの場所を置きます。
まず、このプラグインをインストールする必要があります：
npm install hexo-deployer-sftp --save
次に、ルートディレクトリの_config.ymlの末尾に以下の設定を追加します：
deploy:
type: sftp
host: 159.75.81.123
user: hexo
pass: 123456
remotePath: /home/hexo/blog
port: 22
hexo g -dコマンドを使用して、ブログをサーバーに自動デプロイします。
私が使用している caddy で web のリバースプロキシを行い、caddy の設定ファイルCaddyfileを変更し、caddy を再起動することで正しくウェブページを開くことができます：
cirry.cn{
root * /home/hexo/blog
file_server
}
これで、ブログの基本設定とデプロイ機能が完了しました。次回はテーマの設定について説明します。