hexo配置

1、前言

利用GitHub page的功能可以十分方便的设计出一个美观的个人博客，我的一些非CS的同学都有，这篇文章大概用来记录一些配置过程中踩到的坑，以后，如果有需要会逐步扩展，网上内容七零八碎，我在这里做个整合，供日后查阅，并且就权当刚建好blog的一次试水博文

2、hexo建站

在mac中配置hexo其实十分方便，几行命令，选个主题就可以完成基本的建站、配置等操作。
以下是一些建站用到的命令，根据官网要求，首先确保有安装node.js且版本不低于8.6

安装hexo命令：

1	$ npm install -g hexo-cli

建站命令：

1
2
3

$ hexo init <folder>
$ cd <folder>
$ npm install

新建完成后，指定文件夹目录如下：

├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
└── themes

其中_config.yml用来设置配置文件，source里面的_posts用来保存所写博文，详细的配置方法和hexo结构，可参考官网说明: https://hexo.io/zh-cn/docs/

主题选择

主题选择因人而异，我自己采用next的主题，这是GitHub上star最多的一款主题，功能齐全，界面优雅，可扩展性高，且依然在维护更新，这是github链接，此外 https://hexo.io/theme 上也提供了许多主题，根据文档直接配置即可不再多言，本文下面主要记录些配置next时遇到的一些坑和解决策略

3、添加公式渲染

第一步

hexo原生的引擎是不支持LaTeX的数学公式的，这导致如果需要写一些用到公式的博文只能用图片代替，很不友好，一个比较好的解决方案是将原生的marked渲染引擎改为kramed渲染引擎，后者支持mathjax公式输出，mathjax是一款前端显示公式的插件，配置代码如下：

1 2	npm uninstall hexo-renderer-marked --save npm install hexo-renderer-kramed --save

第二步

安装完毕后，打开 /node_modules/hexo-renderer-kramed/lib/renderer.js，修改其中的代码：

// Change inline math rule
function formatText(text) {
    // Fit kramed's rule: $$ + \1 + $$
    return text.replace(/`\$(.*?)\$`/g, '$$$$$1$$$$');
}
// 把上面这段改为下面
// Change inline math rule
function formatText(text) {
    return text;
}

第三步

然后，修改hexo的math包，改为mathjax:

1 2	npm uninstall hexo-math --save npm install hexo-renderer-mathjax --save

第四步

修改mathjax的配置文件: /node_modules/hexo-renderer-mathjax/mathjax.html，将最后的\ 标签改为如下的格式

1	<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>

第五步

更改默认转义规则，这是由于markdown本身的语法会与LaTeX公式语法相冲突，打开 /node_modules\kramed\lib\rules\inline.js，修改escape，em两个转移规则如下:

1 2	escape: /^\\([`\[\]()# +\-.!_>])/, em: /^\((?:\\\|[\s\S])+?)\(?!\)/,

第六步

对于next主题，主题配置文件_config.yml中要设置(此点很重要，网上教程许多有遗漏，会导致无法渲染):

math:
    enable: true
mathjax:
    enable: true

效果可以检查下，以下代码为显示薛定谔方程

$$ i\hbar\frac{\partial \psi}{\partial t}
= \frac{-\hbar^2}{2m} \left(
\frac{\partial^2}{\partial x^2}
+ \frac{\partial^2}{\partial y^2}
+ \frac{\partial^2}{\partial z^2}
\right) \psi + V \psi.$$

结果如下：

$i\hbar\frac{\partial \psi}{\partial t} = \frac{-\hbar^2}{2m} \left( \frac{\partial^2}{\partial x^2} + \frac{\partial^2}{\partial y^2} + \frac{\partial^2}{\partial z^2} \right) \psi + V \psi.$

其实这个结果并不是重点，如何定位发现无法显示公式是引擎渲染问题，定位转义匹配问题，并且解决它们的过程才是重点，这也是程序员能力之所在

4、添加本站搜索引擎

这个网上有许多教程，不过对于next值得注意的是，searchdb包会导致产生的search.xml文件中的title包含类似CDATA这样的标签，理论上CDATA会被XML解析器忽略，但最后搜索时CDATA会莫名其妙地出现在搜索结果之中，所以建议采用search包，安装命令如下:

1	npm install --save hexo-generator-search

完了直接修改站点配置文件_config.yml即可

1
2
3

search:
  path: search.xml
  field: post

当然搜索引擎还有一些细节，例如修改field可修改引擎覆盖范围等等，可参考对应文档