笔记：Hexo + Obsidian + GitHub Pages

1. TODO

2. 脑图

3. 环境准备

  1. Git
  2. Node.js
  3. PowerShell

4. 创建 Hexo 项目

4.1. 初始化 Hexo 项目

1. 创建文件夹
这里我命名为 myNote（名称可自定义）

2. 使用 PowerShell 打开文件夹

3. 全局安装 hexo

1
npm install -g hexo-cli

4. 初始化 Hexo 项目

1
hexo init

5. 安装相关依赖

1
npm install

4.2. 配置 Hexo 元数据

1. 使用 VS Code 打开 myNote 文件夹

2. 配置 Hexo 元数据
在系统 myNote/_config.yml 文件中配置元数据：

4.3. 启动 Hexo，查看效果

1. 使用 PowerShell 打开文件夹

2. 依次执行命令

1
2
3
4
5
6
7
8
9
10
# 1. 清除现存的 Hexo 的静态文件
hexo clean


# 2. 生成新的 Hexo 静态文件
hexo g


# 3. 启动本地服务器，预览生成的网页效果，便于本地调试
hexo s

3. 查看 Hexo 效果
查看： http://localhost:4000/

4.4. 配置 Hexo 主题

上面展示的 Hexo 默认样式较为简陋，视觉效果不佳。你可以在 Hexo主题库 中挑选一个自己喜欢的主题，这里我选择 Fluid 作为我的主题。

1. 下载 fluid 安装包

2. 解压缩到 myNote/theme 目录下，并将其重命名为 fluid

3. 配置使用 fluid 主题

4. 使用 PowerShell 打开文件夹

5. 添加 about 页面

1
hexo new page about

6. 设置 about/index.md 的头部属性

7. 进行 Hexo 主题配置
根据需要在主题的 myNote/themes/fluid/config.yml 文件中进行相应的配置，具体怎么配，看你自己喜欢就行。

8. 启动 Hexo，查看效果

1
2
3
4
5
6
7
8
9
10
# 1. 清除现存的 Hexo 的静态文件
hexo clean


# 2. 生成新的 Hexo 静态文件
hexo g


# 3. 启动本地服务器，预览生成的网页效果，便于本地调试
hexo s

5. 集成 GitHub Pages

5.1. 进行 Git 代理配置

由于需要将静态页面部署到 GitHub Pages，并将整个 Obsidian 仓库推送到 MyNote 仓库，我们先设置 Git 代理，以提升网络传输速度

1. 检查是否配置过 Git 代理

1
2
3
4
git config --global http.proxy


git config --global https.proxy

2. 如果存在代理，进行代理取消

1
2
3
4
git config --global --unset http.proxy


git config --global --unset https.proxy

3. 重新配置 Git 代理

1
2
3
4
git config --global https.proxy 127.0.0.1:7890


git config --global http.proxy 127.0.0.1:7890

[!NOTE] 注意事项

  1. 此处的端口号需根据你本地 Clash 的配置进行调整，填写你实际使用的代理端口。

5.2. 创建 GitHub Pages

首先，登录 GitHub 并创建一个名为 <your_id>.github.io 的仓库，并确保将其设置为 Public（公开）

5.3. Hexo 项目关联到 GitHub Pages

1. 安装 deploy 插件

1
npm install hexo-deployer-git --save

2. 进行 myNote/config.yml 配置

1
2
3
4
deploy:
  type: git
  repo: https://github.com/wangjia5289/wangjia5289.github.io.git
  branch: main

5.4. Hexo 项目推送到 GitHub Pages

1
2
3
4
5
6
7
8
9
10
11
12
13
14
# 1. 清除现存的Hexo的静态文件
hexo clean


# 2. 生成新的 Hexo 静态文件
hexo g


# 3. 启动本地服务器，预览生成的网页效果，便于本地调试
hexo s


# 4. 将 Hexo 项目推送到 GitHub Pages
hexo d

5.5. 查看 GitHub Pages 效果

查看： https://github.com/wangjia5289/wangjia5289.github.io.git

6. 集成 GitHub Repository

1. 创建 GitHub Repository
我们额外创建一个名为 myNote（名称可自定义）的仓库，并确保将其设置为 Private（私有）用于备份所有文件，以防数据丢失

2. 依次运行命令

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
# 1. 初始化本地 Git 仓库
git init


# 2. 创建 README 文档
echo "随便写点东西好了" > README.md


# 3. 将 README 稳定添加到缓冲取
git add README.md


# 4. 进行第一次推送（务必进行，相当于点火器）
git commit -m "first commit"


# 5. 将当前分支强制重命名为 main
git branch -M main


# 6. 本地仓库与远程仓库进行关联。
git remote add origin https://github.com/wangjia5289/xxxxxx.git


# 7. 进行分支关联（使用 -u 选项，将本地 main 分支与远程 main 分支关联，之后可以直接使用 git push 和 git pull，而无需每次指定远程仓库和分支。）
git push -u origin main


# 8. 后续推送
我们可以通过命令行或使用 GitHub Desktop 等工具来推送代码。

7. 集成 Obsidian

7.1. 创建模版

在Hexo中，为确保每篇文章都能以预设格式和样式展示，通常需要在文章头部设置特定的属性。然而，手动设置这些属性对于每一次撰写新文章来说可能显得繁琐。为简化这一过程，可以创建一个模板。这样，每次撰写新文章时，只需导入该模板，即可自动包含所需的默认属性设置。

1. 创建模版

2. 设置模版

[!NOTE] 注意事项：Hexo 页面加锁

1
2
3
4
5
6
# 1. 安装 hexo-blog-encrypt
npm install --save hexo-blog-encrypt


## 2. 在文章头部添加 password
password: xxxxxx

7.2. Custom Attachment Location 插件

1. 修改 Obsidian 配置

2. 安装 Custom Attachment Location 插件

3. 进行插件配置

4. 进行 myNote/config.yml 配置

1
2
3
4
5
6
7
8
# 1. 将 post_asset_foler 设置为 true
post_asset_folder: true


# 2. 添加下述内容
marked: 
  prependRoot: true
  postAsset: true

7.3. File Explorer++ 插件

1. 安装 File Explorer++ 插件

2. 进行插件配置

7.4. Git 插件

1. 安装 Git 插件

2. 配置插件

3. 手动实现推送到 Repository

8. Page 与域名绑定（可选）

1. 登录 GitHub，在您的 id.github.io 项目中，通过 Settings选项进行域名配置

2. 在 public 文件夹下创建一个名为 CNAME 的文件，并在其中保存您希望绑定的域名

3. 为域名添加 CNAME 记录并指向 id.github.io

Blog
笔记：Hexo + Obsidian + GitHub Pages
https://wangjia5289.github.io/2025/11/23/笔记：Hexo+Obsidian+GitHubPages/
Author
霸天
Posted on
November 23, 2025
Licensed under