使用Github Pages和Hexo搭建自己的Blog

使用Github Pages和Hexo搭建自己的Blog

本教程分为 本地部署 和 部署到Github Pages

涉及：Github、Hexo、Node.js、Git、Hexo、VsCode

本地部署

1.安装Node.js与Git

安装Node.js

点此跳转官网：Node.js

安装Git

点此跳转官网：Git

2.安装Hexo

Hexo的安装是给你的计算机安装Hexo框架，所以这个就随便找个空白的地方（如桌面），右击在弹出的窗口点击Git Bash Here，并且输入以下命令即可安装。

1
npm install hexo-cli -g

3.创建Blog文件夹，并初始化

这里就是你想要把你的Blog放到哪里你就在那里创建文件夹以存放你的Blog工程文件，并在此初始化。

初始化 即在你所选择的文件夹，安装Blog的基础框架，输入以下命令即可初始化该文件夹。

1
hexo init

4.本地效果查看

执行以下命令查看效果

1
2
3
hexo clean
hexo generate
hexo server

一键执行命令

1
hexo cl && hexo g && hexo s #预览一键三连

显示一下内容即代表成功

Hexo is running at http://localhost:4000/ . Press Ctrl+C to stop.

至此本地部署完毕

部署至Github Pages

1.注册Github

首先你得有一个GitHub账号，点击此处访问 Github官网 ，点击Sign Up注册账户。

2.创建项目

点击右上角 + 号，New repository，以创建仓库。

这里注意红色字体，按照要求填写。

保证仓库public，名称填写正确用户名.github.io，系统自动变更为Pages。

3.用VsCode Push to Github

安装部署工具

用VsCode打开Blog文件夹，即初始化的文件夹，然后打开控制台，输入以下命令以安装部署工具。

1
npm install hexo-deployer-git --save

配置Git个人信息

Git会根据用户的名字和邮箱来记录提交，GitHub 也是用这些信息来做权限的处理，输入以下命令进行个人信息的设置，把名称和邮箱替换成你自己的，名字可以不是 GitHub 的昵称，但为了方便记忆，建议与 GitHub 一致。

1
2
git config --global user.name "此处填你的用户名"
git config --global user.email "此处填你的邮箱"

配置部署地址

登陆Github，找到Blog仓库地址，点击Code按钮，点击Https，复制链接。

然后打开Blog所在文件夹下的_config.yml文件，下滑找到deploy，按照以下格式填写。

1
2
3
4
deploy:
  type: git
  repo: 这里填写你复制的Https链接
  branch: main

部署到Github

此时运行以下代码以推送到你的Github项目仓库。

1
2
3
hexo clean //可简写为hexo cl
hexo generate //可简写为hexo g
hexo deployer//可简写为hexo d

一键执行命令

1
hexo cl && hexo g && hexo d #部署一键三连

访问你的Blog

至此大功告成啦，谢谢阅读！🙂

该教程不是很完善，后续会继续优化。

参考：

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

攻城狮 快速搭建个人博客 —— 保姆级教程