睿智的ljw侠

Hexo搭建Blog

以下是使用 Hexo 搭建个人博客的详细步骤。

1. 参考资料

• 从零开始搭建 Hexo 博客简明教程（2024版） | 未知的世界
• 在GitHub中绑定自己的域名，并实现https访问_github域名-CSDN博客
• Hexo-博客无法显示图片解决方法
• 给Hexo博客文章加密
• https://blog.zhheo.com/p/128998ac.html

2. 更换 npm 镜像源

默认的 npm 源可能会因为网络问题导致连接失败。可以尝试切换到其他镜像源，如淘宝的 npm 镜像（npmmirror.com）。

1

npm config set registry https://registry.npmmirror.com/

3. 安装 Hexo CLI 并初始化项目

1
2
3
4

npm install -g hexo-cli
hexo init
npm install
hexo server

在浏览器中输入 http://localhost:4000 查看效果。

4. 更换主题

克隆主题仓库

1

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

修改主题配置

打开 _config.yml 文件，将 theme 从 landscape 修改为 next。

然后，编辑 /themes/next/_config.yml 文件，在 scheme 选项中选择 Mist 主题样式。

生成并启动服务器

1
2

hexo g
hexo s

在浏览器中刷新页面查看新主题效果。

5. 站点配置

编辑根目录下的 _config.yml 文件，根据个人需求修改站点配置。

6. 设置头像

• 在 /source 目录下新建文件夹 uploads，并将头像图片 avatar.jpg 放入该文件夹内。
• 修改 /themes/next/_config.yml 中 avatar 下的 url，指向刚才上传的头像图片。

7. 解决乱码问题

如果遇到乱码问题，需将 _config.yml 文件另存为 UTF-8 编码。

8. 与Git关联

在 GitHub 上新建仓库

在 GitHub 上创建一个名为 XXX.github.io 的项目（XXX 为你的 GitHub 用户名）。

修改 _config.yml 配置

编辑 _config.yml 文件中的 deploy 部分：

1
2
3
4

deploy:
  type: git
  repository: https://github.com/your-name/your-name.github.io.git
  branch: main

安装 Hexo 部署插件

1

npm install hexo-deployer-git --save

9. 配置域名

购买域名

前往 NameSilo购买域名，并填写个人信息。

设置域名解析

• 进入 Domain Manager，点击蓝色球进行域名解析设置。

• 删除所有已存在的解析记录。
• 添加 4 条 A 记录和 1 条 CNAME 记录。

添加 CNAME 文件

在 source 目录下新建一个名为 CNAME 的文件，写入购买的域名。

配置 GitHub Pages

• 进入 GitHub，导航到 XXX.github.io 仓库。
• 进入 Settings 页面，找到 Pages 选项。
• 在 Custom domain 栏中填写你的域名并保存。

部署博客

1
2

hexo g
hexo d

10. 发布新文章

使用 hexo new 命令创建新文章。该命令将在 source/_posts 文件夹中生成一个 .md 文件。修改该文件后，执行以下命令生成并部署博客。

1

hexo new "文章名"

编辑生成的 Markdown 文件，然后运行：

1
2

hexo g
hexo d

11. 显示图片

启用 post_asset_folder

在 Hexo 项目的根目录下，找到并打开 _config.yml 文件，设置 post_asset_folder 为 true。

创建新文章

1

hexo new post_name

Hexo 会在source/_posts目录下生成文章post_name.md，以及同名文件夹post_name。

添加图片资源

将图片放入post_name文件夹中，在文章中使用相对路径引用图片资源：

1

![描述文字](my-photo.jpg)

发现还是无法显示，通过以下方法解决：

1
2

npm uninstall --save hexo-asset-img
npm install hexo-image-link --save

12.加密码

1

npm install --save hexo-blog-encrypt

使用时：

1

password: xxx

13. 设置代理

1
2

git config --global http.proxy http://127.0.0.1:7890
git config --global https.proxy https://127.0.0.1:7890