KaTeX 与 bookdown + gitbook

Question

I am building a bookdown project and rendering it as a gitbook with numerous pages of math and it is rendering sluggishly. I would like to use KaTeX instead of mathJax to render my math but I'm not sure how to get it working. There is a gitbook plugin so it should be possible but I don't quite know how to integrate it with bookdown.

In my index.Rmd file i've tried the following:

---
site: bookdown::bookdown_site
output:
  bookdown::gitbook:
    pandoc_args: [--katex]
    mathjax: NULL
    includes:
      in_header: katex.html
documentclass: book
---

where katex.html consists of the stylesheet and theme for KaTeX.

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css" integrity="sha384-wITovz90syo1dJWVh32uuETPVEtGigN07tkttEqPv+uR2SE/mbQcG7ATL28aI9H0" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.js" integrity="sha384-/y1Nn9+QQAipbNQWU65krzJralCnuOasHncUFXGkdwntGeSvQicrYkiUBwsgUqc1" crossorigin="anonymous"></script>

However, the math is not rendered (save for a few parts that are still rendered by MathJax).

Is there any way that I get get bookdown to work with KaTeX?

Answer 1

It seems you didn't read the KaTeX documentation. KaTeX does not automatically render your math expressions. See the section Automatic rendering of math on a page in its README on Github. In short, you have to load auto-render.min.js and add an event to render the math, eg in your katex.html , you need:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.css" integrity="sha384-wITovz90syo1dJWVh32uuETPVEtGigN07tkttEqPv+uR2SE/mbQcG7ATL28aI9H0" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/katex.min.js" integrity="sha384-/y1Nn9+QQAipbNQWU65krzJralCnuOasHncUFXGkdwntGeSvQicrYkiUBwsgUqc1" crossorigin="anonymous"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.7.1/contrib/auto-render.min.js" integrity="sha384-dq1/gEHSxPZQ7DdrM82ID4YVol9BYyU7GbWlIwnwyPzotpoc57wDw/guX8EaYGPx" crossorigin="anonymous"></script>
<script>
  document.addEventListener("DOMContentLoaded", function() {
    renderMathInElement(document.body);
  });
</script>

To disable MathJax in bookdown gitbook output, you need to set math: false in YAML, eg

---
site: bookdown::bookdown_site
output:
  bookdown::gitbook:
    pandoc_args: [--katex]
    mathjax: NULL
    includes:
      in_header: katex.html
documentclass: book
math: false
---