Hello, world!

记录一下网站的配置过程，方便以后查阅。

公式渲染和代码高亮的问题卡了一天，最后直接重用了旧版本的 Volantis 搭建的博客的代码。

前言

一直有建立个人网站的想法，借着大三上学期选修课的机会终于是尝试动手了，2021年9月23日正式搭起了博客。为了应付课程（主要是有服务器配置的内容），我从腾讯云购买服务器与域名（有优惠的话第一年的价格还算比较美丽）。2022年9月份，收到了腾讯云关于服务器和域名快要到期的通知短信，终于又想起了自己原来还搞了小博客。个人网站是可以发布在 Github 上的，可以省下一笔不小的开支；如果希望域名能自定义则需要多花个域名的钱。此外，博客图片过多的话也可以考虑使用图床。

环境搭建

以下内容均基于 Windows 10，必要的工具有 npm 、 Hexo 、 OpenSSH 以及 git 。

`npm`

新版的 Node.js已经集成了 npm ，因此查找 Node.js 的安装教程即可。

`Hexo`

如果 npm 已经安装完成，那么只需使用如下命令即可安装 Hexo 及其 Github 部署工具。

1	npm install hexo-cli -g && npm install hexo-deployer-git --save

`git` 与 `OpenSSH`

中文互联网上教程很多，并且基本没有什么太大的问题，在此不再赘述。

搭建仓库

在 Github 上登陆账号并新建一个仓库即可，注意仓库名必须是 username.github.io ，其中 username 是 Github 上的用户名。

生成 `SSH keys`

安装好 OpenSSH 后，使用如下命令创建公钥与私钥，其中 github-email 是 Github 账户的邮箱。

1	ssh-keygen -t rsa -C github-email

生成完成后，在 C:/Users/your-username/.ssh 目录下找到 id_rsa.pub 文件（即公钥），将其中的内容复制后在 Github 中的 SSH and GPG keys 一栏中选择 New SSH key 创建新的密钥即可。

`Hexo` 相关内容

初始化

在博客文件夹使用如下命令即可。

hexo init

`Volantis` 主题配置

下载并安装主题

我选择直接从 Github 下载主题源码，这种方式需要将源码文件夹放到 themes 下，随后需要：

复制主题中 _config.yml ，并将其更名为 _config.volantis.yml ，然后拷贝到博客根目录；
将主题源码的文件夹名改为 volantis ，并将根目录中 _config.yml 中 theme 更改为 volantis ，注意 yml 的书写规范。

1	theme: volantis #冒号后一个空格

字体更改

我使用的配置如下所示。

#file: _contig.volantis.yml
  #for valantis, 2023/1/14
  fontfamily:
    codefont:
      fontfamily: 'Fira' # registered font name should be consistent with 'name'
      url: /static/ttf/FiraCode-Regular.ttf # watch out for this term and notice the pattern of valid paths
      name: 'Fira'
    logofont:
      fontfamily: '"Times New Roman", SimSun'
      # name: 'Varela Round'
      # url: https://gcore.jsdelivr.net/gh/volantis-x/cdn-fonts/VarelaRound/VarelaRound-Regular.ttf
      weight: normal
      style: normal
    bodyfont:
      fontfamily: '"Times New Roman", SimSun'
      # name: 'UbuntuMono'
      # url: https://gcore.jsdelivr.net/gh/volantis-x/cdn-fonts/UbuntuMono/UbuntuMono-Regular.ttf
      weight: normal
      style: normal

数学公式渲染

我最终采用的渲染器为 hexo-renderer-marked ，即 Hexo 自带的渲染器。在使用 Volantis-5.7.6 更换渲染器后，报出了如下的错误，一直没有找到解决的办法，这是我直接使用旧版本的其中一个原因，然而最后还是通过重装解决了未知的问题。

ERROR
SyntaxError: Unexpected identifier in "D:\\code\\blog\\themes\\volantis\\layout\\layout.ejs"
    at new Function (<anonymous>)
    at exports.compile (D:\code\blog\node_modules\hexo-renderer-mathjax\node_modules\ejs\lib\ejs.js:242:14)
    at Object.exports.render (D:\code\blog\node_modules\hexo-renderer-mathjax\node_modules\ejs\lib\ejs.js:284:66)
    at Hexo.<anonymous> (D:\code\blog\node_modules\hexo-renderer-mathjax\index.js:14:24)
    at Hexo.tryCatcher (D:\code\blog\node_modules\bluebird\js\release\util.js:16:23)
    at Hexo.ret (eval at makeNodePromisifiedEval (C:\Users\17258\AppData\Roaming\npm\node_modules\hexo-cli\node_modules\bluebird\js\release\promisify.js:184:12), <anonymous>:13:39)
    at D:\code\blog\node_modules\hexo\lib\hexo\render.js:81:22
    at tryCatcher (D:\code\blog\node_modules\bluebird\js\release\util.js:16:23)
    at Promise._settlePromiseFromHandler (D:\code\blog\node_modules\bluebird\js\release\promise.js:547:31)
    at Promise._settlePromise (D:\code\blog\node_modules\bluebird\js\release\promise.js:604:18)
    at Promise._settlePromiseCtx (D:\code\blog\node_modules\bluebird\js\release\promise.js:641:10)
    at _drainQueueStep (D:\code\blog\node_modules\bluebird\js\release\async.js:97:12)
    at _drainQueue (D:\code\blog\node_modules\bluebird\js\release\async.js:86:9)
    at Async._drainQueues (D:\code\blog\node_modules\bluebird\js\release\async.js:102:5)
    at Immediate.Async.drainQueues [as _onImmediate] (D:\code\blog\node_modules\bluebird\js\release\async.js:15:14)
    at processImmediate (node:internal/timers:464:21)

BTW，在尝试对多行公式渲染时果然出现了问题，解决方法详见使用 pandoc 正确渲染多行 MathJax 公式。

代码高亮

在使用 Volantis-5.7.6 实在是没有找到代码高亮的配置方法，还是用回了 4.3.1 版本，现在还需设置复制代码的按钮。经过多次尝试后发现是包安装的问题，最终通过重装解决了相关问题。

评论区

最终采用 giscuss 作为评论区，具体原理详见参考资料。

主题配置文件

多读官方文档以及配置文件中的注释，这是入门最快的一个方式。