使用LaTex添加公式到Hexo博客里
代码编辑器,强烈推荐使用微软的 VS code,相比Atom开启迅速,使用方便,扩展丰富
第一步: 安装Kramed
hexo 默认的渲染引擎是 marked,但是 marked 不支持 mathjax。,所以需要更换Hexo的markdown渲染引擎为hexo-renderer-kramed引擎,后者支持mathjax公式输出。
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$$$$');
}
为,直接返回text
// Change inline math rule
function formatText(text) {
return text;
}

第三步: 停止使用 hexo-math,并安装mathjax包
卸载hexo-math
npm uninstall hexo-math --save
安装 hexo-renderer-mathjax 包
npm install hexo-renderer-mathjax --save


第四步: 更新 Mathjax 的 配置文件
打开/node_modules/hexo-renderer-mathjax/mathjax.html
如图所示更改<script>为:
即注释掉<script>代码,并把以下代码复制到对应位置
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>

第五步: 更改默认转义规则
因为LaTeX与markdown语法有语义冲突,所以 hexo 默认的转义规则会将一些字符进行转义,所以我们需要对默认的规则进行修改.
打开/node_modules\kramed\lib\rules\inline.js
1、
escape: /^\\([\\`*{}\[\]()#$+\-.!_>])/,
更改为
escape: /^\\([`*\[\]()# +\-.!_>])/,
2、
em: /^\b_((?:__|[\s\S])+?)_\b|^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,
更改为
em: /^\*((?:\*\*|[\s\S])+?)\*(?!\*)/,

第六步: 开启mathjax
打开/themes/yilia主题目录下的config.yml文件
因为我用的yilia主题,所以路径是/themes/yilia
我们需要在config.yml文件 中开启 Mathjax, 找到 mathjax 字段添加如下代码:(不同的主题配置方法略微有区别)
mathjax:
enable: true
或者
mathjax: true

注意的是:,无论是配置文件还是博客文件,配置项跟配置参数均有有一个空格,否则会配置失败
例:
mathjax: true(mathjax:空格true)
而不是
mathjax:true(mathjax:true)
写博客文件时,要开启 Mathjax选项,, 添加以下内容:
mathjax: true
例如
title: 特征提取——局部特征
date: 2018-07-16 09:39:40
tags: [GitHub, Mysql]
mathjax: true
如下图所示

通过以上步骤,我们就可以在 hexo 中使用 Mathjax 来书写数学公式。
效果展示:


#我的个人博客主页,欢迎访问
#我的CSDN主页,欢迎访问
#我的简书主页,欢迎访问
#我的GitHub主页,欢迎访问
使用LaTex添加公式到Hexo博客里的更多相关文章
- hexo博客MathJax公式渲染问题
这个问题自己很早以前便碰到了,用MathJax语法写的一些公式,在本地Markdown编译器上渲染是没问题的,可是部署到hexo博客中就出现问题了,之前我是使用图片代替公式应付过去了,今天从网上找了一 ...
- 【干货】2个小时教你hexo博客添加评论、打赏、RSS等功能 (转)
备注:该教程基于Hexo 2.x版本,目前Hexo是3.x版本,照本教程实现有可能会出现404错误,笔者目前还未找时间去解决,待笔者找时间解决该问题后,再写一篇该问题的解决教程,给各位读者带来困扰,还 ...
- Hexo博客maupassant主题添加Google Adsense广告
自从在 Github Page 落户以后,很长一段时间使用的是极简且有点艺术范儿的 fexo 主题,而不是大名鼎鼎的 next 主题.后来偶然发现了符合我审美的Hexo博客 maupassant 主题 ...
- hexo博客添加gitalk评论系统
经过了一天的折腾,我终于为自己的博客添加上了评论系统.坦率的讲,为什么网上那么多方案我还要自己写一篇博客,那就是因为他们说的都有bug,所以我要自己总结一下. 我选用的是gitalk评论系统, ...
- 搭建hexo博客遇到的问题
搭建hexo博客遇到的问题 常用命令 hexo clean 清除hexo缓存 hexo generate 生成文章 hexo deploy 部署 hexo new post name 新建文章名 he ...
- hexo博客进阶-相册和独立域名
之前我已经写了一篇文章详细的讲述了如何使用hexo搭建github博客.如果还没有看的可以去看看,hexo搭建博客 其实,根据这篇文章的过程我们就能够搭建一个专属于自己,并且非常美观的博客了.但是如果 ...
- ubuntu安装hexo博客
ubuntu下安装hexo博客 一 安装git sudo apt-get install git 二 安装nodejs 官网下载linux安装包.tar.gz文件 解压 tar zxvf 这样变可以切 ...
- 史上最详细“截图”搭建Hexo博客并部署到Github
http://jingyan.baidu.com/article/d8072ac47aca0fec95cefd2d.html 大家也搭建过博客,很多时候,按着教程来做就可以了,但是我当时为了搭建Hex ...
- 史上最详细“截图”搭建Hexo博客——For Windows
http://angelen.me/2015/01/23/2015-01-23-%E5%8F%B2%E4%B8%8A%E6%9C%80%E8%AF%A6%E7%BB%86%E2%80%9C%E6%88 ...
- [原创]HEXO博客搭建日记
博客系统折腾了好久,使用过Wordpress,Ghost,Typecho,其中Typecho是我使用起来最舒心的一种,Markdown编辑+轻量化设计,功能不多不少刚好,着实让我这种强迫症患者舒服了好 ...
随机推荐
- Ubuntu20.04 Docker搭建远程xfce桌面以及ssh教程
简介:本文主要介绍ubuntu20.04容器中搭建xfce远程桌面.C++.Go环境.容器内docker操作配置. 一.创建容器1.创建容器 docker pull ubuntu:20.04docke ...
- 2023 年十大 API 管理趋势
本文探讨了 API 管理在数字化转型中的重要性,以及 API 管理面临的挑战和发展机遇.文章重点介绍了十大 API 管理发展趋势,包括 API 安全性.API 标准化.云端 API 管理解决方案.低代 ...
- 密码学与网安——intro
Terminology primitive: 原语 (一种不可分割的最基础操作,跟具体的视角和情形有关) 两个时间节点 1949年(1945年):Shannon 提出完全安全性,开始现代密码学 197 ...
- vue移动端预览 pdf 文件
pdf预览,在项目中是很常见的需求,在PC端web项目中,我们可以使用window.open(url)直接打开pdf进行预览,那么移动端虽然我们也可以使用此方法,但是这是新开了一个webview页面, ...
- 记一次nginx配置不当引发的499与failover 机制失效
背景 nginx 499在服务端推送流量高峰期长期以来都是存在的,间或还能达到告警阈值触发一小波告警,但主观上一直认为499是客户端主动断开,可能和推送高峰期的用户打开推送后很快杀死app有关,没有进 ...
- 简单理解重载运算符&位运算
重载运算符 作用 重载运算符的作用大致可以理解为自定义一个运算法则,比如当我们在使用结构体的时候,我们有时候会用到优先队列,但是优先队列并不能对于结构体使用,所以这个时候我们就需要用到重载运算符来自定 ...
- 【Azure 存储服务】Java Storage SDK 调用 uploadWithResponse 代码示例(询问ChatGTP得代码原型后人力验证)
问题描述 查看Java Storage SDK,想找一个 uploadWithResponse 的示例代码,但是通过全网搜索,结果没有任何有帮助的代码.使用最近ChatGPT来寻求答案,得到非常有格 ...
- 聊一聊redis十种数据类型及底层原理
概述 Redis 是一个开源的高性能键值数据库,它支持多种数据类型,可以满足不同的业务需求.本文将介绍 Redis 的10种数据类型,分别是 string(字符串) hash(哈希) list(列表) ...
- ASP.NET Response.Filter
寫 ASP.NET 有時候會想要在畫面輸出前一刻進行攔截,並換掉 html 中的特定字元.例如網站中有許多頁面都有 www.google.com.tw 的超連結,我希望在測試機上可以把連結換成 www ...
- vue全家桶进阶之路34:Vue3 路由基本配置
在Vue3中,路由的基本配置是通过使用Vue Router库来实现的.以下是Vue3中路由的基本配置步骤: 安装Vue Router 使用npm或yarn在项目中安装Vue Router: npm i ...