hexo支持mathjax

新博客:https://yinl.fun
欢迎关注,同步更新html

技术博客有时避免不了一些数学公式,利用Hexo创建博客后,最开始利用Google的公式库,可是得请求Google的网址,有时会被墙,因此不得不转战方向。让Hexo本身支持mathjax必然是一个省心的过程。然而事实并不省心。若是要创建一个支持数学公式的基于Hexo框架的博客,你得符合如下要求:node

  • 博客:Hexo,博客的搭建能够看我以前的文章
  • 支持mathjax的markdown渲染器:hexo-renderer-kramed
  • 支持mathjax的Theme:NexT:(NexT使用文档,以前用的Archar,不过不支持mathjax)
  • markdown编辑器:Typora

安装渲染器

hexo默认的渲染器是marked,并不支持mathjax。kramed是在marked基础上修改的,支持了mathjax。你的hexo工程目录下的node_modules中能够找到对应的渲染器文件夹。同时在你的工程目录下用如下命令安装kramed。另外补充一个NexT配置中推荐的渲染器hexo-renderer-pandoc,功能很强大不只能够渲染markdown,还支持textile、reStructedText等许多其余格式。具体参见官方教程ajax

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

若是你安装了hexo-math包,卸载再安装hexo-renderer-mathjax包npm

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

更新mathjax的CDN连接,打开node_modules/hexo-renderer-mathjax/mathjax.htmlmarkdown

修改<scripts>标签hexo

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

NexT开启mathjax

打开主题的_config.yml文件,找到math字段,新版的NexT主题支持两个数学渲染引擎mathjax和katex,这里咱们使用mathjax框架

math:
  enable: true
  // 省略不少注释
  engine: mathjax

文章中开启mathjax标签

为加快渲染速度,渲染器只会在标签中有mathjax: true的文章中使用利用mathjax渲染。例:编辑器

title: hexo支持mathjax
date: 2018-08-31 08:33:08
tags: [Web,hexo,mathjax]
mathjax: true // 开启后才会渲染数学公式

Typoare

Typoare原生支持数学公式的输入和渲染,并且还支持本地图片导入的图片复制位置。code

而后开启你的Typoare编辑器输入几串公式,看看效果吧~cdn

相关文章
相关标签/搜索