Fast math typesetting for the web.
—
Pending
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Pending
The risk profile of this skill
Primary rendering functions that convert TeX expressions to DOM elements or HTML strings with comprehensive error handling and configuration options.
Renders TeX expression directly into a DOM element, replacing its content.
/**
* Renders TeX expression into a DOM element
* @param tex - TeX expression to render
* @param element - DOM element to render into (content will be replaced)
* @param options - Rendering options
*/
function render(tex: string, element: HTMLElement, options?: KatexOptions): void;Usage Examples:
import katex from "katex";
// Basic rendering
const element = document.getElementById("math-container");
katex.render("x = \\frac{-b \\pm \\sqrt{b^2-4ac}}{2a}", element);
// With options
katex.render("\\int_0^\\infty e^{-x^2} dx", element, {
displayMode: true,
fleqn: true
});
// Error handling
katex.render("\\invalid", element, {
throwOnError: false,
errorColor: "#ff6b6b"
});Converts TeX expression to HTML string for server-side rendering or programmatic use.
/**
* Renders TeX expression to HTML string
* @param tex - TeX expression to render
* @param options - Rendering options
* @returns HTML string containing rendered math
*/
function renderToString(tex: string, options?: KatexOptions): string;Usage Examples:
import katex from "katex";
// Basic string rendering
const html = katex.renderToString("E = mc^2");
// Display mode
const displayHtml = katex.renderToString("\\sum_{i=1}^n i^2", {
displayMode: true
});
// MathML output
const mathml = katex.renderToString("\\frac{1}{2}", {
output: "mathml"
});
// Server-side rendering with error handling
const safeHtml = katex.renderToString("\\maybe\\invalid", {
throwOnError: false,
errorColor: "#cc0000"
});KaTeX throws ParseError exceptions for invalid TeX input when throwOnError is true.
/**
* Error thrown when TeX parsing fails
*/
class ParseError extends Error {
/** Always "ParseError" */
name: "ParseError";
/** Character position where error occurred */
position: number;
/** Length of problematic input */
length: number;
/** Original error message without context */
rawMessage: string;
/** Full error message with TeX source context */
message: string;
constructor(message: string, token?: object);
}Usage Examples:
import katex, { ParseError } from "katex";
try {
katex.render("\\invalid{command}", element);
} catch (error) {
if (error instanceof ParseError) {
console.log(`Parse error at position ${error.position}: ${error.rawMessage}`);
// Show fallback content
element.textContent = "Math rendering failed";
}
}
// Alternative: disable throwing
const result = katex.renderToString("\\invalid{command}", {
throwOnError: false,
errorColor: "#ff0000"
});
// Returns HTML with error styling instead of throwing/**
* Current KaTeX version string
*/
const version: string;Usage Example:
import katex from "katex";
console.log(`Using KaTeX version: ${katex.version}`);