One of the challenges I encountered when moving my website from Jekyll to Docusaurus was rendering math equations in some of my blog posts (for example, about the apriori algorithm). In Jekyll, I used MathJax with Liquid to render them. This didn’t work in Docusaurus, so instead I had to use KaTeX.
The Docusaurus docs provide pretty clear instructions on how to use KaTeX in your project. This post is a more straightforward tutorial, and reflects my experience (and issues) specific to my website.

Install the
remarkmath
andrehypekatex
plugins (in my case, with npm):npm install save remarkmath@3 rehypekatex@5 hastutiliselement@1.1.0

Open your project’s configuration file
docusaurus.config.js
:
At the top (right after the lines importing the Docusaurus themes), add the two plugins:
const math = require('remarkmath'); const katex = require('rehypekatex');

In presets, under both the docs and blog categories, add the two plugins:
remarkPlugins: [math], rehypePlugins: [katex],
Make sure to add the plugins under all page categories where you want math equations to be rendered. I initially added them only under docs, and was confused why equations were rendered on my About page, but not in blog posts, until I figured out the reason.

In stylesheets, add the source of KaTeX:
stylesheets: [ { href: 'https://cdn.jsdelivr.net/npm/katex@0.13.24/dist/katex.min.css', type: 'text/css', integrity: 'sha384odtC+0UGzzFL/6PNoE8rX/SPcQDXBJ+uRepguP4QkPCm2LBxH3FA3y+fKSiJ+AmM', crossorigin: 'anonymous', }, ],


Update the formulas in existing content, considering the differences between Jekyll vs. Docusaurus, and MathJax vs. KaTeX.
 In Jekyll, formulas are wrapped in double
$$
, whereas for Docusaurus they’re wrapped in single$
. Replace all instances of$$
with$
.  If some equations are still not displayed correctly, it might be because they need a different syntax in KaTeX than in MathJax. Check this in the KaTeX docs of suported functions and test the equations in their online editor.
 In Jekyll, formulas are wrapped in double