Typst 插件游乐场

此页面展示了使用多种引擎的数学渲染能力：Typst、LaTeX 和 KaTeX。

Typst 组件包（vitepress-typstex-vue）

vitepress-typstex-vue 包提供了一个 Vue 组件 <TypstMath>，用于渲染 Typst 或 LaTeX 风格的表达式。

渲染逻辑

• 主要：Typst WASM 编译器（原生 Typst 语法）
• 回退：KaTeX 或 MathJax（用于 LaTeX 语法）
• Typst 失败时自动回退

行内数学示例

这是一个行内公式： 在文本中。

行间数学示例

混合公式（Typst 语法）

复杂表达式

求根公式：

矩阵表示：

求和与极限：

渲染引擎对比

让我们用同一个公式比较三种不同引擎的渲染效果。

目标公式：

\int_0^\infty e^{-x^2}\,dx = \frac{\sqrt{\pi}}{2}

1. Typst 原生（Typst 语法）

使用 Typst 的原生语法：

2. TypstMath 回退（MathJax）

当配置为 latexEngine: 'mathjax' 时，LaTeX 风格输入会回退到 MathJax：

单个组件覆盖回退引擎

全局插件设置默认的回退引擎，但任意 <TypstMath> 都可以通过 latex-engine 属性单独指定：

<TypstMath
  src="\\int_0^\\infty e^{-x^2}\\,dx = \\frac{\\sqrt{\\pi}}{2}"
  :is-block="true"
  latex-engine="katex"
  :fontSize="18"
/>  <!-- 强制使用 KaTeX -->

<TypstMath
  src="\\int_0^\\infty e^{-x^2}\\,dx = \\frac{\\sqrt{\\pi}}{2}"
  :is-block="true"
  latex-engine="mathjax"
  :fontSize="18"
/>  <!-- 强制使用 MathJax -->

3. markdown-it-typstex 回退（KaTeX）

同样的 LaTeX 公式交给 markdown-it-typstex 插件解析，Typst 失败时回退到 KaTeX：

4. 纯 Typst 语法

使用 Typst 的数学语法：

markdown-it-typstex 插件

该插件允许您直接在 markdown 中编写数学表达式。

行内数学

这是一个行内公式： 用于升力计算。

著名的欧拉恒等式：。

行间数学（双美元符号）

麦克斯韦方程组：

行间数学（数学代码块）

您也可以使用带有 math 语言的围栏代码块：

更多示例

微积分

导数定义：

泰勒级数：

线性代数

行列式：

特征值方程：

统计学

正态分布：

贝叶斯定理：

物理学

薛定谔方程：

洛伦兹变换：

其中 。

LaTeX 兼容性

插件还支持传统的 LaTeX 语法：

中文数学表达式

在中文环境中使用数学公式：

已知圆的半径为 ，则圆的面积为 ，周长为 。

三角函数恒等式：

勾股定理：

等差数列求和公式：

等比数列求和公式：

渲染优先级

1. Typst WASM（主要）：快速、功能丰富、原生 Typst 语法
2. MathJax（回退）：全面的 LaTeX 支持，包体积较大
3. KaTeX（回退）：快速的 LaTeX 渲染，包体积较小

最佳实践

• 使用 Typst 语法以获得更好的性能和更小的包体积
• 使用 LaTeX 语法以兼容现有内容
• 对复杂公式测试不同引擎以获得最佳效果