前言

之前主机商到期了，更换了一个主机商，只迁移了主站，资源舱没有迁移。因为使用的WordPress过于臃肿，于是打算用静态的Hexo进行重构。中途经历了挺多失败，查阅了很多资料最后做成了现在的效果：https://lib.hoyue.fun

这里是仅为个人搭建的记录，仅供参考。

---

介绍与准备

Hexo是一个快速、简单、强大的博客框架，它基于Node.js运行。

Qexo是一个快速、强大、漂亮的在线Hexo编辑器，可以帮助您更方便地管理您的Hexo博客。

Vercel是一个部署平台，可以帮助您快速部署您的Hexo博客，无需任何配置。

因为Hexo是一个静态页面生成器，没有后端，写文章、发布、修改等操作都需要文件修改再commit后push到仓库，非常麻烦。于是使用Qexo这个后端，连接到Hexo可以实现在线写文章啦，自动更新文件，vercel自动部署，大大提高效率。

除此之外，还可以使用hexo plus plus 等后端。

在开始搭建Hexo博客之前，还需要准备一些软件或环境。首先是本地的nodejs环境和Git管理工具。nodejs 需要在NodeJS官网下载。

NodeJS的安装一路next即可，最后安装完了在命令行(cmd/powershell)中查询版本来验证是否安装成功。

node -v

成功安装会出现版本号，如图：

Git管理工具我使用了Github Desktop，更加简便快捷，之后演示为使用Github Desktop的。

Github Desktop安装好后登录GitHub，在“GitHub Desktop”菜单栏中选择“File”，然后单击“New respository...”来创建新的存储库。选择一个本地地址，打开那个文件夹。

其次请注册好Vercel账号，选择Hobby即可，在里面连接GitHub。这样注册好以后 Vercel里面就可以看到你 Github 里面的项目了。

---

本地创建Hexo项目

在终端中打开刚才的存储库文件夹，输入hexo的安装命令。

如果是在中国大陆，npm下载速度过于感人，可以使用淘宝源。

npm config set registry https://registry.npm.taobao.org

接下来就是安装hexo：

npm install hexo-cli -g

等待一段时间，就可以在本地看到hexo的主要文件了。

接下来是clone主题文件，我使用的主题是butterfly的改版——安知鱼主题，主题文档：https://blog.anheyu.com/docs

打开GitHub Desktop，点击Files - Clone respository...，点击URL，输入主题Git地址，我的是https://github.com/anzhiyu-c/hexo-theme-anzhiyu.git

Local path我们直接填到hexo目录\themes\主题名称，这个一般文档或命令中会写。等待clone结束，就已经添加到hexo里了。

复制主题文件夹中的_config.yml到 hexo 根目录，并重命名为_config.主题名称.yml，我的是_config.anzhiyu.yml

最后编辑根目录的_config.yml，修改主题名称，和一些基本配置本地就已经全部准备好了。当然你也可以配置好主题的各种配置，最后再部署。

附：Hexo配置文件修改文档：https://hexo.io/zh-cn/docs/configuration

在本地调试看看自己的hexo博客，在终端中输入：

hexo server

如果没有错误，就可以在本地查看了。本地默认地址：http://localhost:4000。

如果要结束运行，可以执行：Ctrl+C。

如果本地测试好没问题，就可以 push 到 Github 了。

---

Push到GitHub并部署到vercel

首先先点击Fetch Origin 查找文件改动

然后在左下角的输入框中写本次文件改动 (Commit) ，然后点击 Commit to main

最后，点击右上角的 Push origin ，这样文件就上传到 Github 了。

现在打开vercel，把它部署到vercel上，点击新建一个project，选择刚才上传的仓库点击import。

随便填一个名称，框架选择Hexo，直接部署即可。

等待一段时间的部署，然后就成功部署到vercel上了。

最后成功以后，会给你一个二级域名，这个二级域名是属于你的，不会回收，建议可以调试的时候临时使用。你现在可以点击那个二级域名，就可以看到你的 Hexo 博客了。

但是因为这个二级域名被GFW屏蔽了，建议自己绑定域名。

在项目的设置 - 域名处，你可以设置自己的域名，只需要做一个CNAME到cname.vercel-dns.com.等待一下就自动关联了，还帮你部署SSL。

vercel的速度在大陆访问比较优秀，也有Anycast的CDN免费使用。

---

部署Qexo

Qexo是一个美观、强大的在线静态博客管理器。它支持使用 Vercel 零成本一键部署, 只需要配置一个免费数据库。使用Qexo可以在线编辑文章，免去了很多繁琐的步骤。

我使用了Vercel托管 + Vercel其提供的免费数据库。还有其他的部署方法，请看官方文档：https://www.oplog.cn/qexo/start/build.html

先点击链接一键部署到vercel。首次部署会报错, 请无视并继续下一步。

然后进入Vercel Storage 界面，点击右上角的 Create Database 并选择 Postgres 创建免费 PostgreSQL 数据库, 在 Connect 页面获取数据库连接信息。请注意在地区选择的位置选择一个你喜欢的地区。

在左侧边栏选择 Projects 点击 Connect Project 连接到你前面创建的项目。例如：

然后在刚才的项目的设置下Settings处，选择Function Region，选择刚才数据库的位置，必须位置相同！

最后回到你的项目页面，在 Deployments 点击 Redeploy 开始部署。

这样就不会有报错并且成功部署了。

我们可以绑定一个域名给它，第一次打开会要求填写一些配置信息。其中要求有GitHub的token：https://github.com/settings/tokens

它这个只会出现一次，创建好以后就要复制到配置去。

还需要VERCEL_TOKEN和PROJECT_ID，可以在这里生成。PROJECT_ID在你的项目Project Settings -> General -> Project ID中有。

连接好了以后就可以通过Qexo来管理hexo博客啦。

---

后记

感谢您阅读这篇文章。希望您能够通过本文了解如何使用Hexo、Qexo和Vercel搭建一个静态博客。如果您在搭建过程中遇到任何问题，欢迎在评论区留言，我会尽力回答您的问题。祝您搭建博客顺利！

References：

• 使用 Vercel 和 Github 部署 Hexo 安装以及使用教程
• Qexo文档
• 如何使用 vercel + hexo 搭建博客