使用hexo 搭建个人网站

下载软件 #

使用到的软件有

• Node
• Git
• Clash Verge Rev

Node 和 Git 都需要环境变量

Node ![[Pasted image 20250319101809.png]]

Git git --version

![[Pasted image 20250319101809.png]]

node npm 配置镜像源 #

打开终端，`` npm config set registry https://registry.npmmirror.com

设置代理 #

打开Clash Verge Rev ，导入代理https://sub.crossxx.com:8443/sub/vmess/1742342404

Github #

注册github #

打开Github, 注册一个账号。

连接github #

打开终端

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

创建ssh 密钥

ssh-keygen -t rsa -C "GitHub 邮箱"

添加密钥，打开 https://github.com/settings/keys

添加C:\Users\用户名\.ssh 文件夹下id_rsa.pub 里面的内容

![[Pasted image 20250319184959.png]]

测试连接

ssh -T git@github.com

创建仓库 #

https://github.com/new

仓库名需要一定是 用户名.github.io

Hexo #

安装 #

使用npm 安装Hexo, 打开终端, mac 在命令前面加sudo

npm install -g hexo-cli

初始化 #

Hexo 初始化和本地预览

因为hexo是依赖本地markdown文件进行渲染。所以需要一个文件夹用来保存你的东西 创建一个空的文件夹，在其中运行：

hexo init
npm install

启动本地预览：

hexo g   # 生成页面
hexo s   # 启动预览

然后访问：http://localhost:4000 进行预览

主题 #

https://hexo.io/themes/ 在这里可以自己选择好看的主题

推荐的主题，个人感觉还不错的

• https://argvchs.github.io/
• https://butterfly.js.org/
• https://hexo.fluid-dev.com/
• https://d-sketon.github.io/
• https://sariay.github.io/

我们以fluid 这款主题做为教程，仓库中一般都有教程，我们使用方式一进行安装。

![[Pasted image 20250319190225.png]]

需要来到刚刚创建文件夹的那个地方，在文件夹中打开终端， 运行

npm install --save hexo-theme-fluid

然后在博客目录下创建 _config.fluid.yml，将主题的 _config.yml 内容复制进去。

然后预览看一下本地的效果

hexo g   # 生成页面
hexo s   # 启动预览

上传到网站上 #

本地博客测试成功后，就是上传到 GitHub 进行部署，使其能够在网络上访问。

首先安装 hexo-deployer-git：

npm install hexo-deployer-git --save

然后修改 _config.yml 文件末尾的 Deployment 部分，修改成如下：

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

完成后运行 hexo d 将网站上传部署到 GitHub Pages。

完成！这时访问我们的 GitHub 域名 https://用户名.github.io 就可以看到 Hexo 网站了。