美文网首页
hexo + yilia-plus + mathjax 显示数学

hexo + yilia-plus + mathjax 显示数学

作者: e1bff2a5f918 | 来源:发表于2020-08-22 21:14 被阅读0次

    hexo + yilia-plus + mathjax 显示数学公式

    1. 使用 Kramed 代替 hexo 自带的 Marked

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


    更改/node_modules/hexo-renderer-kramed/lib/renderer.js

    function formatText(text) {
        // Fit kramed's rule: $$ + \1 + $$
        return text.replace(/`\$(.*?)\$`/g, '$$$$$1$$$$');
    }
    

    function formatText(text) {
        return text;
    }
    

    2. 停止使用 hexo-math 并安装 mathjax

    如果你已经安装 hexo-math, 请卸载它,然后安装 hexo-renderer-mathjax 包

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

    注意: 由于一些原因,当使用yilia-plus主题时,使用mathjax会报错,如果仍要使用mathjax,根据 yilia-plus作者 JoeyBling提供的解决方案,需要进入 node_modules/hexo-renderer-mathjax文件夹执行如下代码:

    npm uninstall ejs -S
    # 安装最新版ejs
    npm i ejs@latest -S
    

    3. 更改默认转义规则

    因为 hexo 默认的转义规则会将一些字符进行转义,所以我们需要对默认的规则进行修改.
    对文件 node_modules/kramed/lib/rules/inline.js 参考半路出家的coder进行如下更改:

    escape: /^\\([\\`*{}\[\]()#$+\-.!_>])/,
    //修改为
    escape: /^\\([`*\[\]()# +\-.!_>])/,
    
    em: /^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
    //修改为
    em: /^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
    

    我只是修改了上面的 em 项,这一项好像对应的是行内公式转义问题,我没有更改 escape 项,可以正常显示。

    4. 配置 Mathjax

    在文件 node_modules\hexo-renderer-mathjax\mathjax.html 中添加如下一行代码:

    <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script>
    

    注意,我之前查了很多网上的 hexo 配置 Mathjax 的文章,它们在该文件中加入的代码通常是

    <script type="text/javascript" async src="cdn.mathjax.org/mathjax/latest/MathJax.js"></script>
    

    但是这行代码仅在本地(即执行hexo s时)可以渲染 tex 数学公式,但是部署到 github 后就不能渲染 tex 数学公式了,所以强烈推荐使用第一种代码,这是Mathjax官网给出的url

    最后在你使用的主题中添加

    mathjax: 
      enable: true
      # 是不是没页都使用mathjax
      perpage: false
    

    最后执行

    hexo clean
    hexo g
    hexo d
    

    这时打开博客就能看到渲染效果了,渲染很快哦。

    相关文章

      网友评论

          本文标题:hexo + yilia-plus + mathjax 显示数学

          本文链接:https://www.haomeiwen.com/subject/fskbjktx.html