Hexo + GitHub 搭建个人博客

1 前言

1.1 目的

记录日常开发、学习过程中遇到的问题，方便后续查看

1.2 最终效果

通过网址 https://your username.github.io 直接访问搭建好的博客

1.3 高级设置

该篇旨在博客搭建，高级设置请查看Hexo 高级设置

2 准备工作

2.1 基本环境

• GitHub 账号
• Node.js (Node.js 版本需不低于 10.13，建议使用 Node.js 12.0 及以上版本)
• Git

2.2 创建博客对应的 GitHub 仓库

• 仓库名称必须为your username.github.io
• 必须为 public 仓库，否则访问博客会404
• 下图中我的username是yanadh，那么对应的仓库名称就是yanadh.github.io
  

3 博客搭建

3.1 安装 Hexo

$ npm i hexo -g

3.2 初始化

$ hexo init

执行该命令，Hexo 自动下载相关文件到本地

3.3 预览

$ hexo s

浏览器访问 http://localhost:4000/ ，即可查看本地博客效果，除修改 _config.yml 站点配置文件外，其他文件更改无需重启服务器，可直接刷新查看

3.4 发布

3.4.1 安装插件

$ npm i hexo-deployer-git

3.4.2 修改站点配置文件

在根目录下找到 _config.yml ，修改最下方 deploy 内容

deploy:
  type: git
  repo: `your username`.github.io 仓库
  branch: 分支名

例如：
deploy:
  type: git
  repo: git@github.com:YanaDH/yanadh.github.io.git
  branch: master

3.4.3 将静态文件推送到 GitHub 仓库

$ hexo g -d

执行该命令，生成静态网页文件存放在 public 文件夹下，并推送到 _config.yml 文件 deploy.repo 配置的仓库
以上命令执行成功后，浏览器访问 https://your username.github.io ，即可查看博客
部署需要时间，若刷新后无效，等待一段时间再试

4 主题修改

4.1 下载主题

可以在 Hexo 官网上选择一款喜欢的主题，并克隆到 themes 文件夹下

$ git clone https://github.com/theme-kaze/hexo-theme-kaze.git

4.2 修改站点配置文件

在根目录下找到 _config.yml ，修改最下方 theme 内容

theme: 主题文件夹名称

例如：
theme: hexo-theme-Mic_Theme

4.3 修改主题内容

可直接到主题对应的 GitHub 提供的文档查看具体修改内容：hexo-theme-Mic_Theme