Welcome to Hexo! This is your very first post. Check documentation for more info. If you get any problems when using Hexo, you can find the answer in troubleshooting or you can ask me on GitHub.

关于搭建的详细流程可以观看B站up主 卷二兔的主页,里面的视频详细的记载了使用Hexo搭建博客的教程

这里是Hexo的官网–>HEXO.
这里是我使用的主题Butterfly的安装文档–>Butterfly。关于Blog主题的设置,在文档中有详细的记录。

环境搭建

git

版本控制工具
下载地址 https://git-scm.com/
通过git -v查看git版本,检查是否成功安装

Node js

JavaScript运行环境
下载地址 https://nodejs.org/ja/download/

注意版本问题,在查看教程时,要注意观看最新的教程。
环境变量的配置方面,现在的软件一般不需要手动填写环境变量了

通过node -v查看nodejs版本,检查是否成功安装
同时,npm -v检查npm是否成功安装

安装hexo

在完成所有的环境搭建准备后,开始安装hexo

首先在终端中执行

1
$ npm install hexo -g

安装hexo.(注意,windows系统安装时要以管理员权限,打开终端,进行安装)

安装完成后,执行$ hexo -v检查是否成功安装。

如果从头搭建博客

进入想要存放博客的文件夹,打开终端,执行

1
$hexo init 文件名

将博客的依赖文件安装到指定的文件夹中。

成功之后,进入博客文件夹,执行

1
$ npm install

安装依赖,完成之后,博客的框架就搭建好了,可以通过执行预览的命令查看

1
$ hexo serve

通过本地地址,查看预览效果。

将博客部署到github上

首先在GitHub上新建一个名为 用户名.github.io 的public仓库,
之后打开终端,输入命令

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

用户名和邮箱都是GitHub账户的用户名和邮箱

设置完成后,打开博客文件夹中的 config.yml 文件,配置deploy部分,具体配置如下图
config文件配置
其中 repo 的设置,建议使用github.io库的SSH。

之后打开终端,输入指令

1
$ npm install hexo-deployer-git --save

进行安装。

GitHub添加SSH密钥

在博客目录中打开 git bash here 输入以下代码

1
ssh -T git@github.com

如果结果为 Permission denied(publickey) ,则证明缺少密钥,通过以下步骤添加

1
ssh-keygen -t rsa -C "yourmail"   # 后面为Github注册邮箱

之后都同意,回车,最后生成密钥

根据提示,在路径xxx/.ssh/id_rsa.pub中找到密钥文本,全部复制。

在自己的GitHub中,Settings -> SSH keys -> New SSH key 添加之前复制的密钥。

之后测试SSH连接

1
ssh -T git@github.com

显示连接成功,即可继续博客部署工作。

继续将博客部署到github上

在博客目录下打开终端,或使用git bash
首先清理缓存内容

1
$ hexo clean

之后生成文件

1
$ hexo g

最后上传至github

1
& hexo d

结束

将博客的文件包保存到github仓库上

创建一个新的仓库,将文件放进新的仓库中的步骤

1
2
3
4
5
6
$ echo "# 123" >> README.md
$ git init
$ git commit -m "first commit"
$ git branch -M main
$ git remote add origin git@github.com:KarsonKang/Blog.git
$ git push -u origin main

更新github上的文件

1
2
3
4
5
6
7
$ git init  //初始化
$ git add .
$ git commit -m "第几次提交"
$ git remote add origin url(htts地址)
$ git remote add origin https://github.com/KarsonKang/Blog.git
$ git remote -v //查看状态
$ git push origin master

如果显示失败,登陆上GitHub Desktop,检测到新的上传信息后,githubdesktop会自动更新。