利用Github搭建Hexo博客

一、配置好搭建环境

Node.js:http://nodejs.cn/download/

Git:https://git-scm.com/downloads

image-20221006132804518

image-20221006133106214

安装成功后通过cmd命令确认是否安装成功及版本号
查看Node.js版本命令:node -v
查看Git版本命令:git --version

image-20221006133432120

二、确保拥有Github账号

Github:https://github.com/

image-20221006133640331

新建 Github个人仓库(已有仓库请直接 Create a New Repository

创建仓库请注意仓库名格式:用户名.github.io

image-20221006134214019

三、部署准备

请选择一个文件位置放置你的hexo文件

image-20221006134416445

这里选择 C:\Users\[UserName]\Git\hexo

打开之前安装的Git工具中的 GitBash ,打开默认在你的用户名目录下,利用cd命令进入新建好的文件夹

image-20221006134716700

image-20221006134614915

注:git 默认是从国外服务器下载,受网络的影响比较大,有可能会出现异常,所以我们可以利用国内淘宝镜像进行安装。

输入命令:

npm install -g cnpm --registry=https://registry.npm.taobao.org

注:之后使用的命令以 cnpm 开头,而不是默认的 npm

image-20221006135319725

四、部署Hexo

(1)、 安装hexo
输入命令进行安装:

cnpm install -g hexo-cli

image-20221006135718812

(2)、 初始化hexo

请输入以下命令进行初始化:

hexo init

image-20221006140953708

注:若出现无法访问Github的情况如上图请忽略

(3)、 预览hexo

输入以下命令预览:

hexo s

image-20221006141208055

打开浏览器访问 http://localhost:4000/

image-20221006141332748

此时Hexo博客已经成功在本地跑起来了🎉

停止预览请按 ctrl + c 组合键

五、Github远程配置

(1)、 生成 ssh-key
输入命令:cd ~/.ssh
输入命令:ssh-keygen -t rsa -C 'github注册的邮箱地址'

image-20221006142156769

默认回车即可

生成的ssh密钥文件如下:

image-20221006142230894

使用记事本打开 id_rsa.pub 文件并复制生成的key

image-20221006142448363

(2)、 Github配置 ssh-key

点击右侧头像并进入Setting页面

image-20221006142520249

点击左侧的 SSH and GPG keys –> New SSH key ,填入前面复制下来的 ssh-key 保存即可。

image-20221006143117082

image-20221006143301483

image-20221006143354540

配置完成后在本地进行验证

输入**ssh -T git@github.com**

输入 yes 之后,将会显示你的用户名信息

image-20221006144852329

(3)、 GitBash 绑定 Github 信息

输入命令:

git config --global user.name "注册用户名"

输入命令:

git config --global user.email "注册邮箱"

image-20221006145425422

六、部署至Github

用记事本打开并修改本地仓库目录下 _config.yml 文件

image-20221006145536018

在文件的末尾添加Github仓库信息

deploy:
type: git
repository: https://github.com/用户名/用户名.github.io.git
branch: master

image-20221006150625452

安装部署工具

cnpm install hexo-deployer-git

image-20221006145951848

此时步骤已经基本完成,接下来部署即可。

为了测试效果,先新建一篇文章:

hexo new test

image-20221006150312946

清空缓存文件:

hexo clean

image-20221006151447901

生成hexo静态文件:

hexo g

image-20221006150411947

预览效果:

hexo s

image-20221006150515821

部署至Github:

hexo d

image-20221011133524017

查看 GitHub 仓库是否部署成功

image-20221011133554126

七、查看效果

部署过后稍等几分钟等待GitHub刷新,打开你的博客链接就可以看到效果了✨

打开 https://【你的用户名】.github.io/ 即可查看效果

Hexo (decoow.github.io)

image-20221011133755326