前言

由于本人经济原因(阿里云服务器太贵了)，一段时间内停止了网站的更新，但是如今，我胡汉三又回来了！
那么第一篇文章自然就要写借助hexo这一博客框架,vercel这一托管网站搭建网站的过程了。

工具介绍

Hexo

它是一个博客框架，用于搭建快速高效的静态网页。它所需要的环境是Node.js

Node.js是一个JavaScript运行时环境，它又可以通过npm这一包管理工具进行下载更新等。

  • 下载
1
sudo apt install nodejs npm

但是这样下载的nodejs版本为10,不满足我们的要求，使用n升级nodejs

1
2
3
4
5
node -v
npm cache clean -f
npm install -g n
n latest
node -v

而后，就可以下载hexo了。

1
2
npm install hexo-cli -g
hexo -v

验证成功之后，就可以找个本地目录创建相关文件了。

1
2
3
hexo init [folder]
cd [folder]
npm i

安装主题

1
npm install hexo-theme-redefine@latest
1
2
3
4
5
6
# 清楚缓存
hexo clean
# 生成静态文件
hexo generate
# 启动本地服务器
hexo server

启动本地服务器之后就可以在本地看到网页了,(https://localhost:4000),但是公网上还看不到。下面就要部署到Vercel，让别人也能看到。

首先配置下，把代码同步到github上:

  1. 打开_config.yml
  2. 在deploy中添加type:git, repo:[git仓库地址]，branch:main
  3. 安装hexo-deployer-git
1
npm install hexo-deployer-git --save
  1. 上传文件
    1
    2
    3
    hexo clean
    hexo generate
    hexo deploy

记得先配置git，这都基操的

Vercel

Hexo的内容已经配置完毕了，下面是Vercel的配置。

  1. 注册账号，并绑定GitHub
  2. Create Project,选择从github中import(实际上之前是可以直接从模板中导入Hexo的，但是现在已经没有了)
  3. 选择刚刚上传的仓库，取个名字，直接Deploy，网站就搭建好了

但是你会发现它链接的网站是带乱码的，因此需要将我们的网站和我们的域名链接起来。

  1. 添加域名，找到Domains,将域名加进去，然后它会自动生成解析记录，将这个解析记录添加到域名服务器中进行解析，稍等几分钟

使用

我们使用的博客框架就是Hexo，那么就使用Hexo命令来生成命令。

1
hexo new [layout] <title>

文章生成到source/_posts下，为md文件。

将文章推送到发布目录下

1
hexo publish [layout] <title>

最后发布

1
2
hexo generate
hexo deploy

配置主题

主题是butterfly,实际上该配置方法在官网即有介绍:butterfly-install

有从仓库下载和Npm安装主要这两种方法，需要注意自己当前终端所处目录，不是所有目录均能满足要求，只有hexo的根目录下才可以。

之后修改_config.yml文件，设置指定的主题theme即可。