博客搭建导航 🌏

  1. 基于hexo搭建博客基础（一）
  2. 基于hexo搭建博客基础（二）
  3. 基于hexo搭建博客基础（三）

1.前言

  1. 这个系列是关于如何基于 hexo 框架以及 GitHub Pages 搭建自己的博客网站。
  2. ❗ 创建本系列博客的初衷也只是为了记录一下自己的学习过程，以防之后健忘 ❗。
  3. 虽说如此，但是本系列博客已经写的很详细了，可能后面的内容会比较简略，就算是零基础也能懂大部分。

2.环境与工具准备

本系列是面向 Windows 用户的，所需工具：

  • 操作系统：Windows11
  • Node.js
  • Git
  • Hexo
  • GitHub 账号
  • 文本编辑器（随便一个都行，甚至 word 文档也可以 🤣，不过还是推荐 VSCode）

3.Node.js 的安装

  1. 下载地址：https://nodejs.org/en/download/
  2. 安装。
  3. 打开终端，输入node -v来查看 node.js 的版本，看到版本号则为安装成功。
  4. 修改 npm 源，看情况，有梯子就不用了，要修改就按照输入以下命令：
1
npm config set registry <替换的npm源>

4.安装 Hexo

  1. 输入以下命令：
1
npm install -g hexo-cli
  1. 以上命令为全局安装（全局安装路径为：C:\Users\Administrator\AppData\Roaming\npm，输入npm config get prefix查看），安装的包将会放到此路径底下的 node_modules 里，如果不想全局的话，就在指定路径底下打开终端，输入以下命令：
1
npm install hexo-cli
  1. 输入npx hexo -v查看 hexo 版本（不是全局安装的话要将终端切换到指定路径），看到版本号就是安装成功了。

5.GitHub 创建仓库

创建一个名为<GitHub 用户名>.github.io 的仓库
❗❗❗ 仓库名的格式必须为<GitHub 用户名>.github.io，否则后面会出现 bug 还有 404❗❗❗

6.Git 安装

  1. 下载地址：https://git-scm.com/downloads
  2. 安装
  3. 配置用户名和邮箱
1
2
git config --global user.name "用户名"
git config --global user.email "邮箱"

7.连接 GitHub

两种都可以

使用 ssh 连接

  1. 生成 ssh 密钥对,生成的公钥和密钥在 C:\Users\Administrator.shh 里，输入以下命令：
1
ssh-keygen -t rsa -C "邮箱"
  1. 输入以下命令查看 ssh 公钥
1
cat .ssh\id_rsa.pub
  1. 将公钥复制到 GitHub 账号里。

使用 https 连接

直接用就好了

8.初始化 Hexo 项目

  1. 在目标路径打开终端（不是全局安装的就在装了 hexo 的那个路径里初始化），输入以下命令：
1
npx hexo init <项目名>
  1. cd进入项目中，输入npx hexo s，输入后会在本地的 4000 端口启动项目。
  2. 在浏览器输入http://localhost:4000/，可以看到一份 HelloWorld 文档，证明博客已经搭建好了。

9.将静态的博客网站挂载到 GitHub Pages 上

  1. 安装 hexo-deployer-git
1
npm install hexo-deployer-git --save
  1. 修改_config.yml 文件，这个文件为网站的配置文件，可以打开官方的教程，修改 deploy 配置：
1
2
3
4
deploy:
  type: "git"
  repository: <仓库地址>
  branch: main
  1. 改好后，输入以下命令将博客部署到 GitHub 上：
1
2
npx hexo clean; npx hexo generate; npx hexo deploy
// 可以简写为 npx hexo cl; npx hexo g; npx hexo d
  • npx hexo clean：删除之前生成的静态文件。
  • npx hexo generate：生成静态文件。
  • npx hexo deploy：将静态文件部署到 GitHub 上。