Katex

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

Configuration to pass to katex

displayMode boolean undefined

If true, math will be rendered in display mode (math in display style and center math on page)

If false, math will be rendered in inline mode

Default:

true

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.

Default:

"htmlAndMathml"

leqno boolean undefined

If true, display math has \tags rendered on the left instead of the right, like \usepackage[leqno]{amsmath} in LaTeX.

Default:

false

fleqn boolean undefined

If true, display math renders flush left with a 2em left margin, like \documentclass[fleqn] in LaTeX with the amsmath package.

Default:

false

throwOnError boolean undefined

If true, KaTeX will throw a ParseError when it encounters an unsupported command or invalid LaTex

If 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 errorColor

Default:

true

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 arguments

If false, \color will work like LaTeX's \color and takes 1 argument

In both cases, \textcolor works as in LaTeX

Default:

false

maxSize number undefined

All user-specified sizes will be caped to maxSize ems

If 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 Infinity, marco expander will try to fully expand as in LaTex

Default:

1000

strict boolean string object undefined

If false or "ignore", allow features that make writing in LaTex convenient but not supported by LaTex

If true or "error", throw an error for such transgressions

If "warn", warn about behavior via console.warn

Default:

"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 true (trust input), allow all such commands.

Default:

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"
/>