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 aParseError
when 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
#XXX
or#XXXXXX
- macros any
A collection of custom macros.
See
src/macros.js
for 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
,\color
will work like LaTeX's\textcolor
and takes 2 argumentsIf
false
,\color
will work like LaTeX's\color
and takes 1 argumentIn both cases,
Default:\textcolor
works as in LaTeXfalse
- maxSize number undefined
All user-specified sizes will be caped to
maxSize
emsIf 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
false
or"ignore"
, allow features that make writing in LaTex convenient but not supported by LaTexIf
true
or"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. {.tip}