Skip to content

@sciexpr/renderer

多格式渲染器。

安装

bash
npm install @sciexpr/renderer katex

KaTeX HTML

typescript
import { KatexRenderer } from '@sciexpr/renderer'

const html = new KatexRenderer().render(ast).value

Unicode

typescript
import { UnicodeRenderer } from '@sciexpr/renderer'

new UnicodeRenderer().render(ast).value
// → "x² + y₂" (Unicode上下标) / "α+β" (希腊字母) / "H₂O" (化学式)

MathML

typescript
import { MathMLRenderer } from '@sciexpr/renderer'

new MathMLRenderer().render(ast).value
// → '<math xmlns="..."><mrow>...</mrow></math>'

AST → LaTeX

typescript
import { LatexReverseRenderer } from '@sciexpr/renderer'

new LatexReverseRenderer().render(ast).value
// → '\\frac{1}{2}'

注册表

typescript
import { RendererRegistry, KatexRenderer, UnicodeRenderer } from '@sciexpr/renderer'

const registry = new RendererRegistry()
registry.register(new KatexRenderer())
registry.register(new UnicodeRenderer())

registry.render(ast, 'html')     // KaTeX HTML
registry.render(ast, 'unicode')  // Unicode 纯文本

渲染增强 (v0.7.0)

\left/\right 尾随空格修复

LatexReverseRenderer 对所有以字母结尾的 LaTeX 命令添加尾随空格。\left/\right 等 delimiter 前缀命令需要紧邻分隔符,修复后排除这些命令(使用 Set.has() 精确匹配)。

Delimiter 内 Group 解包

AST 序列化时 group 节点包裹 {...},在 \left 后变成 \left({...}\right)。KaTeX 误将 { 识别为分隔符。修复后 delimiter 内检测到 group 节点时直接展平 children。

自定义渲染器

typescript
class SvgRenderer implements IRenderer {
  id = 'svg'; outputFormat = 'svg' as const
  render(ast) { return { value: '<svg>...</svg>', format: 'svg' } }
}
registry.register(new SvgRenderer())

基于 MIT 协议发布