2025-08-19 GitHub Hexo NexT流程

發表於 閱讀次數：
2025-08-19 GitHub Hexo NexT流程

2025-08-19 GitHub Hexo NexT流程

好，這裡我從 0 到上線，用「實務流程＋為什麼要這樣做」一步一步帶你完成
👉 新的 GitHub Pages 網站 + Hexo + NexT 主題 + 寫文章

我會假設你是 Mac（你之前用 Mac），如果有一步你已經做過，可以直接跳過。

一、整體流程先給你「地圖」

你要做的事情其實只有 7 大步：

  1. 準備環境（Node.js、Git）
  2. 建立新的 GitHub Repository（給 Hexo 用）
  3. 安裝 Hexo
  4. 建立 Hexo 專案
  5. 安裝 NexT 主題
  6. 設定 GitHub Pages 自動部署
  7. 寫文章 & 發佈

二、環境準備（只要做一次）

1️⃣ 檢查 Node.js

Hexo 是跑在 Node.js 上的。

1
2
node -v
npm -v
  • 有版本號 → OK
  • 沒有 → 安裝

安裝（建議用官方 LTS）

👉 https://nodejs.org
下載 LTS 版本

安裝完再確認一次。

2️⃣ 檢查 Git

1
git --version
  • 有版本 → OK
  • 沒有 → 安裝 Xcode Command Line Tools
1
xcode-select --install

三、建立新的 GitHub Pages Repository（重點）

你說「要再建立一個新的」，所以這裡是 新的 repo。

1️⃣ 決定網站網址型式（很重要）

✅ 方案 A（最常用）

1
https://你的帳號.github.io/新專案名/

例如：

1
https://lilychiou.github.io/hexo-blog/

→ 適合多個網站並存（推薦）

2️⃣ 建立 GitHub Repo

到 GitHub → New Repository

欄位 填寫
Repository name hexo-blog（你要的名字）
Public ✅
Initialize README ❌ 不要勾

建立完成後，記下 repo URL，例如：

1
https://github.com/lilychiou/hexo-blog.git

四、建立 Hexo 專案

1️⃣ 安裝 Hexo CLI（只要一次）

1
npm install -g hexo-cli

確認：

1
hexo -v

2️⃣ 建立 Hexo 專案資料夾

1
2
3
4
mkdir hexo-blog
cd hexo-blog
hexo init
npm install

完成後，資料夾會長這樣（重點）：

1
2
3
4
hexo-blog/
├─ _config.yml      ← Hexo 主設定
├─ source/          ← 文章放這
├─ themes/          ← 主題

3️⃣ 本地測試

1
hexo s

瀏覽：

1
http://localhost:4000

看到預設文章 → 成功

五、安裝 NexT 主題（重點）

NexT 是 Hexo 最成熟的主題之一。

1️⃣ 安裝 NexT

1
2
cd themes
git clone https://github.com/next-theme/hexo-theme-next.git next

2️⃣ 啟用 NexT

回到根目錄：

1
cd ..

編輯 _config.yml

找到：

1
theme: landscape

改成：

1
theme: next

3️⃣ 再跑一次本地

1
hexo s

如果畫面變成 NexT → OK

六、設定 NexT（建議必改）

NexT 有自己的設定檔：

1
themes/next/_config.yml

建議先改這幾個：

1
scheme: Pisces   # 版型（推薦 Pisces / Gemini）
1
language: zh-TW
1
2
3
4
5
menu:
  home: / || fa fa-home
  archives: /archives/ || fa fa-archive
  tags: /tags/ || fa fa-tags
  categories: /categories/ || fa fa-th

七、設定 GitHub Pages 部署（重點）

1️⃣ 安裝部署工具

1
npm install hexo-deployer-git --save

2️⃣ 修改 Hexo 主設定 _config.yml

找到最下面的 deploy，改成：

1
2
3
4
deploy:
  type: git
  repo: https://github.com/你的帳號/hexo-blog.git
  branch: gh-pages

⚠️ 注意：

  • gh-pages 是 Hexo 產出的靜態頁面
  • main/master 不要用來放產出檔

3️⃣ 設定 GitHub Pages

到 GitHub Repo → Settings → Pages

設定 值
Source Deploy from a branch
Branch gh-pages
Folder / (root)

存檔後等 1～2 分鐘。

八、寫第一篇 Hexo 文章（重點）

1️⃣ 新增文章

1
hexo new "我的第一篇文章"

會產生：

1
source/_posts/我的第一篇文章.md

2️⃣ 編輯文章

1
2
3
4
5
6
7
8
9
10
---
title: 我的第一篇文章
date: 2026-01-05 21:00:00
categories: Hexo
tags:
  - Hexo
  - NexT
---

這是我用 **Hexo + NexT** 建立的第一篇文章。

3️⃣ 本地確認

1
hexo s

4️⃣ 發佈到 GitHub

1
2
3
hexo clean
hexo generate
hexo deploy

成功後開：

1
https://你的帳號.github.io/hexo-blog/

🎉 完成

九、常見錯誤（先幫你避雷）

❌ 404

  • GitHub Pages 還沒生效（等 1–2 分鐘）
  • repo 名稱或路徑寫錯

❌ deploy 失敗

  • repo URL 錯
  • 沒有權限（GitHub 要登入）
  • branch 寫錯（一定是 gh-pages）

十、下一步我可以幫你做的

你可以直接接著問我：

  1. ✅ NexT 中文最佳設定（適合技術＋筆記）
  2. ✅ 多分類 / 標籤規劃
  3. ✅ 圖片放哪裡最乾淨
  4. ✅ Hexo 寫「技術筆記」的模板
  5. ✅ 一個 GitHub 帳號放 多個 Hexo 網站

你可以直接說：
👉「幫我把 NexT 設成技術筆記風格」