Hexo blog markdown 수식 표현 mathjax

분명 MarkDown math tutorial대로 수식을 작성하고 Ipython notebook에서도 정상적으로 출력되는걸 확인했지만,
Hexo post는 아래처럼 읽어내지를 못한다.
으아악 아니야!

Hexo plugin 설치

다른 블로그 모듈을 사용하는 방법도 있지만, Hexo를 설치했으니 그대로 사용하기 위해 우선 구글링으로 해결해본다.
검색 결과 hexo에서 사용하는 랜더링 모듈에 수식표현 문법이 포함되어 있지 않아서 발생하는 문제였다.

기본 renderer 교체

Hexo의 기본 renderer인 marked를 제거하고 mathjax를 지원하는 kramed로 교체한다.

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

설치가 완료되면 ..\node_modules\hexo-renderer-kramed\lib\renderer.js에서 formatText 함수의 반환값을 변경해준다.

1
2
3
4
5
6
// Change inline math rule
function formatText(text) {
// Fit kramed's rule: $$ + \1 + $$
return text;
// return text.replace(/`\$(.*?)\$`/g, '$$$$$1$$$$'); // (: default)
}

mathjax 설치

kramed 랜더러에 설정값을 넣어줄 mathjax 랜더러를 설치한다.

1
$ npm install hexo-renderer-mathjax --save

마찬가지로 ..\node_modules\hexo-renderer-mathjax\mathjax.html에서 스크립트 source url을 교체한다.

1
2
3
<script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML"></script>
<!-- <script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> --> <!--: default -->

Mathjax 활성

이제 사용하고 있는 _config.theme.yml에서 mathjax를 활성화 시켜주면된다.

1
2
3
mathjax:
enable: true
# mathjax: false # : default

markdown 문법을 사용할 예정이라 문법 추가 설정은 하지 않는다.

예제

오…

외부링크

Author

Hangack

Posted on

2021-11-13

Updated on

2022-02-14

Licensed under

댓글