Hugo에서 Math 표현식을 설정하려면 MathJax 또는 KaTeX와 같은 수식표현 라이브러리를 사용해야 한다. 이들 라이브러리는 LaTeX 형식의 수학 표현식을 웹 페이지에 아름답게 렌더링할 수 있게 해준다.
Mathematics in Hugo
markdown 에서 수식을 입력하는 방식은 대표적으로 2가지 이다. $$...$$ 혹은 \[...\]으로 문단(block)으로 수식을 작성하는 방법과, $...$ 혹은 \(...\) 으로 본문중에 인라인으로 입력하는 방식이다. 다만, 문제가 있는데, Hugo 에서는 $...$ 방식이 작동하지 않는다. 이유는 hugo 사이트의 문서 를 뒤적이다가 찾았는데, 아래와 같이 설명하고 있었다.
The configuration above precludes the use of the $...$ delimiter pair for inline equations. Although you can add this delimiter pair to the configuration and JavaScript, you will need to double-escape the $ symbol when used outside of math contexts to avoid unintended formatting.
$ 기호로도 수식입력을 허용하는 경우, 수학 식 외의 문맥에서 의도하지 않은 형식으로 작동될까봐 제외하여 가이드를 제공하고 있다. hugo.toml 파일에 아래와 같이 입력해야 인라인 수식까지 완벽히 사용할 수 있다.
# hugo.toml
[markup]
[markup.goldmark]
[markup.goldmark.extensions]
[markup.goldmark.extensions.passthrough]
enable = true
[markup.goldmark.extensions.passthrough.delimiters]
block = [['\[', '\]'], ['$$', '$$']]
inline = [['\(', '\)']]
[params]
math = true
마지막으로 예를 들어 하나 작성해보자. 이렇게 웹페이지에서도 수식표현이 가능하다.
$$ \frac{\Delta P}{P} \approx - D \times \frac{\Delta i}{1+i} $$- \(D\) : 듀레이션, \(\Delta P\) : 채권 가격의 변화량, \(P\): 채권의 현재 가격, \(\Delta i\): 금리 변화량
실제 markdown 문서에 입력한 텍스트는 아래와 같다. 위 수식을 이용하여 작성한 포스팅이 있으니 여기를 참고하면 좋을 듯 하다.
$$
\frac{\Delta P}{P} \approx - D \times \frac{\Delta i}{1+i}
$$
- \(D\) : 듀레이션, \(\Delta P\) : 채권 가격의 변화량, \(P\): 채권의 현재 가격, \(\Delta i\): 금리 변화량