1. hexo博客搭建

安装 Hexo

1. 安装 Node.js

下载 Node.js，安装时除了修改安装目录为 D 盘，其余步骤都点击下一步。

Alt Text

安装完成后，使用 Win + R 输入 CMD 打开命令行，输入 node -v，如果出现版本号，则说明安装成功。

Node.js 安装成功

将 npm 源修改为阿里云镜像源，在 CMD 窗口运行以下命令：

1
npm install -g cnpm --registry=https://registry.npmmirror.com

npm 镜像源设置

2. 安装 Git

下载 Git，安装时除了修改安装目录为 D 盘，其余步骤都点击下一步。

Alt Text

  • Git CMD 是 Windows 命令行风格。
  • Git Bash 是 Linux 系统命令行风格（推荐使用）。
  • Git GUI 是图形化界面（不建议新手使用）。
1
2
3
git config -l  # 查看所有配置
git config --system --list # 查看系统配置
git config --global --list # 查看用户（全局）配置

3. 使用 SSH 连接 GitHub

打开 Git Bash。

Git Bash 打开

配置用户名和邮箱，用户名为 GitHub 账号，邮箱为注册 GitHub 的邮箱。

1
2
git config --global user.name "用户名"
git config --global user.email "邮箱"

使用 git config -l 检查是否配置成功。

Git 配置检查

配置公钥 GitHub，执行以下命令生成 SSH 公钥，用于计算机连接 GitHub。

1
ssh-keygen -t rsa -C "邮箱"

在提示 Enter file in which to save the key 时，直接一路回车即可，不推荐设置密钥。

SSH Key 生成

使用 Everything 搜索 id_rsa.pub 并打开路径。

SSH Key 文件路径

id_rsa.pub 就是公钥，用记事本打开并复制内容，然后在 GitHub 中找到 Settings - SSH and GPG keys 配置 SSH 密钥。

Alt Text

Alt Text

名字随便填一个。

Alt Text

GitHub SSH Key 配置完成

测试连接，输入以下命令：

1
ssh -T git@github.com

提示 Are you sure you want to continue connecting (yes/no/[fingerprint])?，输入 yes 即可。

GitHub SSH 连接测试

GitHub SSH 连接测试582×370 33.1 KB

出现 You've successfully 则表示成功，完成了环境准备工作。

GitHub SSH 连接成功

GitHub SSH 连接成功581×370 29.5 KB

4. 创建 GitHub 仓库

打开 GitHub，点击右上角的 + 号，选择 New repository，创建一个 <用户名>.github.io 的仓库。

GitHub 创建仓库

仓库名字的格式必须为：<用户名>.github.io，可见性选择 public，方便第一次部署检查问题，点击 Create repository 进行创建。

Alt Text

5. 初始化 Hexo 博客

创建一个文件夹保存博客源码，这里选的路径为 D:/Hexo-Blog，在文件夹内右键鼠标，选择 Open Git Bash here。

Git Bash 在博客目录打开

在 Git BASH 输入以下命令安装 Hexo：

1
npm install -g hexo-cli && hexo -v

Hexo 安装

完成安装后，输入 hexo -v 验证是否成功。

Hexo 版本验证

初始化 Hexo 项目并安装相关依赖：

1
2
3
hexo init hexo
cd hexo
npm i

Hexo 初始化

初始化后，D 盘博客文件夹下会出现以下文件：

Hexo 博客目录

  • node_modules：依赖包
  • scaffolds：生成文章的一些模板
  • source：用来存放文章
  • themes：主题
  • .npmignore：发布时忽略的文件（可忽略）
  • _config.landscape.yml：主题的配置文件
  • _config.yml：博客的配置文件
  • package.json：项目名称、描述、版本、运行和开发等信息

输入 hexo cl && hexo s 启动项目。

Hexo 启动

打开浏览器，输入地址：http://localhost:4000/，看到以下效果，说明构建成功了。

Alt Text

三、1 将静态博客挂载到 Github Pages

修改 _config.yml 文件，在 Blog-demo 目录下的 _config.yml，这是 Hexo 框架的配置文件，可以修改大部分配置，可参考官方wiki。

修改最后一行的配置，将 repository 修改为自己的 GitHub 项目地址，branch 要改为 main 代表主分支（注意缩进）。

Alt Text

1
2
3
4
deploy:
  type: git
  repository: git@github.com:你的用户名/你的用户名.github.io.git
  branch: main

Alt Text

安装 hexo-deployer-git：

1
npm install hexo-deployer-git --save

Hexo Deployer 安装

部署到 GitHub，输入命令：

1
hexo clean && hexo generate && hexo deploy

Hexo Deploy

如果出现 Deploy done，则说明部署成功了。

Hexo Deploy 完成

  • hexo clean：删除之前生成的文件，可以用 hexo cl 缩写。
  • hexo generate：生成静态文章，可以用 hexo g 缩写。
  • hexo deploy：部署文章，可以用 hexo d 缩写。

稍等两分钟，打开浏览器访问：https://<用户名>.github.io/，就可以看到博客内容了。

Alt Text