hexo yelee主题中部分公式无法显示的问题

最近发现在yelee中一部分公式无法显示，也就是一篇博客的一部分公式无法正常显示，谷歌了一下发现是默认的markdown语法渲染引擎mathjax的响应太慢了，于是有人建议改用katex引擎来代替，因此就尝试了一下katex引擎，主要步骤参考的是hexo的yelee主题使用katex引擎(markdown渲染加速).

安装katex引擎相关的渲染器

主要是三步，首先是安装hexo-math

sudo npm install hexo-math --save

在这一步的时候可能会提示warning为

npm WARN babel-eslint@10.0.1 requires a peer of eslint@>= 4.12.1 but none was installed.

这是由于babel-eslint需要一个依赖项eslint，因此使用命令安装一下即可消除这个问题：

sudo npm install eslint@4.x babel-eslint@10 --save-dev

上述命令中的@后面的数字可以根据WARN中的版本号来自适应地修改。

然后是安装渲染器和渲染器相关的内容：

sudo npm un hexo-renderer-marked --save
sudo npm i hexo-renderer-markdown-it-plus --save

添加引擎

在站点根目录下的_config.yml上添加：

math:
  engine: katex
  katex:
    css: https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css
    js: https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.js
    config:
      # KaTeX config
      throwOnError: false
      errorColor: "#cc0000"

yelee主题的_config.yml下把原本的mathjax:True给注释掉，添加：

# Math Equations Render Support
math:
  enable: true
  per_page: false
  #engine: mathjax
  engine: katex
 
  katex:
    # Use 0.7.1 as default, jsdelivr as default CDN, works everywhere even in China
    cdn: //cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css
    #cdn: //cdn.jsdelivr.net/npm/katex@0.7.1/dist/katex.min.css
    # CDNJS, provided by cloudflare, maybe the best CDN, but not works in China
    #cdn: //cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css
 
    copy_tex:
      # See: https://github.com/KaTeX/KaTeX/tree/master/contrib/copy-tex
      enable: true
      copy_tex_js: //cdn.jsdelivr.net/npm/katex@0/dist/contrib/copy-tex.min.js
      copy_tex_css: //cdn.jsdelivr.net/npm/katex@0/dist/contrib/copy-tex.min.css

然后重新生成页面即可得到没有错误的公式显示了。

参考

感谢https://blog.csdn.net/appleyuchi/article/details/92795620与https://blog.csdn.net/qq_43153418/article/details/88380082两篇博客提供的帮助。