Katex
TeX math rendering in html
Options See on deno.land
- extensions string[]
The list of extensions this plugin applies to
Default:[ ".html" ]- cssSelector string
The css selector to apply katex
Default:".language-math"- options object
Documentation: https://katex.org/docs/options.html
- displayMode boolean undefined
If
true, math will be rendered in display mode (math in display style and center math on page)If
Default:false, math will be rendered in inline modetrue- output html mathml htmlAndMathml undefined
Determines the markup language of the output. The valid choices are:
html: Outputs KaTeX in HTML only.mathml: Outputs KaTeX in MathML only.htmlAndMathml: Outputs HTML for visual rendering and includes MathML for accessibility.
"htmlAndMathml"- leqno boolean undefined
If
Default:true, display math has \tags rendered on the left instead of the right, like \usepackage[leqno]{amsmath} in LaTeX.false- fleqn boolean undefined
If
Default:true, display math renders flush left with a 2em left margin, like \documentclass[fleqn] in LaTeX with the amsmath package.false- throwOnError boolean undefined
If
true, KaTeX will throw aParseErrorwhen it encounters an unsupported command or invalid LaTexIf
Default:false, KaTeX will render unsupported commands as text, and render invalid LaTeX as its source code with hover text giving the error, in color given by errorColortrue- errorColor string undefined
A Color string given in format
#XXXor#XXXXXX- macros any
A collection of custom macros.
See
src/macros.jsfor its usage- minRuleThickness number undefined
Specifies a minimum thickness, in ems, for fraction lines, \sqrt top lines, {array} vertical lines, \hline, \hdashline, \underline, \overline, and the borders of \fbox, \boxed, and \fcolorbox.
- colorIsTextColor boolean undefined
If
true,\colorwill work like LaTeX's\textcolorand takes 2 argumentsIf
false,\colorwill work like LaTeX's\colorand takes 1 argumentIn both cases,
Default:\textcolorworks as in LaTeXfalse- maxSize number undefined
All user-specified sizes will be caped to
maxSizeemsIf set to Infinity, users can make elements and space arbitrarily large
Default:"Infinity"- maxExpand number undefined
Limit the number of macro expansions to specified number
If set to
Default:Infinity, marco expander will try to fully expand as in LaTex1000- strict boolean string object undefined
If
falseor"ignore", allow features that make writing in LaTex convenient but not supported by LaTexIf
trueor"error", throw an error for such transgressionsIf
Default:"warn", warn about behavior viaconsole.warn"warn"- trust boolean function undefined
If
false(do not trust input), prevent any commands that could enable adverse behavior, rendering them instead in errorColor.If
Default:true(trust input), allow all such commands.false- globalGroup boolean undefined
Place KaTeX code in the global group.
Default:false- delimiters object[] undefined
Auto-render specific options
Default:[ { left: "$$", right: "$$", display: true }, { left: "\\(", right: "\\)", display: false }, { left: "\\begin{equation}", right: "\\end{equation}", display: true }, { left: "\\begin{align}", right: "\\end{align}", display: true }, { left: "\\begin{alignat}", right: "\\end{alignat}", display: true }, { left: "\\begin{gather}", right: "\\end{gather}", display: true }, { left: "\\begin{CD}", right: "\\end{CD}", display: true }, { left: "\\[", right: "\\]", display: true } ]- ignoredTags string[] undefined
- Default:
[ "script", "noscript", "style", "textarea", "pre", "code", "option" ] - ignoredClasses string[] undefined
- preProcess function undefined
Description
This plugin uses the KaTeX library to render the math typesetting of your HTML documents. You only need to add the language-math extension to any math content that you want to render. In markdown pages, it can be done in code blocks with the math language:
# This is a markdown document
```math
c = \pm\sqrt{a^2 + b^2}
```
Or addign the language-math directly to the html element containing the code:
<p class="language-math">
c = \pm\sqrt{a^2 + b^2}
</p>
Installation
Import this plugin in your _config.ts file to use it:
import lume from "lume/mod.ts";
import katex from "lume/plugins/katex.ts";
const site = lume();
site.use(katex(/* Options */));
export default site;
Load styles
To render any HTML generated by katex in the browser, you will need to link the CSS file and use the HTML5 doctype.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.2/dist/katex.css">
See Browser usage in the KaTeX site documentation for more info.