使用 Github Pages 和 Hexo 搭建自己的独立博客

入门

Github

搭建一个这样的 Blog 首先你得知道什么是 Github 和 Github Pages，你可以理解为咱们没有服务器，咱们将页面托管到了 Github 上

Github Pages

Github Pages 可以被认为是用户编写的、托管在 github 上的静态网页。使用 Github Pages 可以为你提供一个免费的服务器，免去了自己搭建服务器和写数据库的麻烦。此外还可以绑定自己的域名。

Hexo

Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown（或其他渲染引擎）解析文章，在几秒内，即可利用靓丽的主题生成静态网页。

node.js

安装node.js

进入 node.js 官网：node.js官网
按照自己的机器选择对应的版本下载，我是 windous 64 位

然后差不多就是一直下一步 hhh~
如果遇到什么问题，一般百度都能解决，这里就不在赘述.

Git

安装git

这是 Git 官网：git官网
一般就是下载好自己对应的版本后一直下一步就好了

检验软件是否安装成功

同时按下 Win 键和 R 键打开运行窗口,输入 cmd ，然后输入以下命令，有相应版本信息显示则安装成功，若不正确可以卸载软件重新安装。

git --version
node -v
npm -v

此外若安装成功，在桌面右键鼠标，可以看到菜单里多了 Git GUI Here 和 Git Bash Here两个选项，第一个是图形界面的Git操作，另一个是命令行，我们一般使用第二个 

Hexo 安装

选择一个磁盘，新建一个文件夹，自己重命名文件夹（如：我的文件夹为：F\QiQi_Blog），博客相关文件将储存在此文件夹下，在该文件夹下右键鼠标，点击 Git Bash Here，输入以下 npm 命令即可安装,第一次可能需要久一点输入命令后等一等，再输入第二条命令

npm install hexo-cli -g

这个命令表示安装 hexo 的脚手架，如图所示即为安装成功 

Hexo 初始化配置

第一个命令，如果失败了就再输入一次，第二个命令表示安装 hexo 部署到 git page 的 deployer

hexo init
npm install hexo-deployer-git --save

Hexo 安装完成后，将会在指定文件夹中新建所需要的文件

本地查看效果

hexo generate
hexo server

执行完即可登录 http://localhost:4000/ 查看效果

安装主题

推荐主题 butterfly 安装及配置

请认真阅读配置文档

托管到 GitHub

安装 hexo-deployer-git

npm install hexo-deployer-git --save

修改 _config.yml 文件 deploy 部分

deploy:
  type: git
  repository: git@github.com:<用户名>/<用户名>.github.io.git
  branch: main

修改好配置后记得 CTRL+S 保存，运行以下命令，将代码部署到 GitHub

hexo cl; hexo g; hexo d

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

部署到 Vercel

官网地址

使用 GitHub 注册并登录，选择 Add New > Project

找到之前创建的库，点后面的 Import，直接点 Deploy 等待部署完成

之后到 Project 页面 > Domains 添加自己的域名，在域名管理页解析即可通过域名访问了！

📚 总结

完成以上步骤后，您的 Hexo 博客就搭建完成了！主要实现了:

• 基础环境配置
• Hexo 框架安装
• GitHub Pages 部署
• 主题美化

---