KaTeX
在 HTML 中渲染 TeX 数学公式
配置参数
- 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 for katex options:
See https://katex.org/docs/autorender.html
- delimiters object[] undefined
- 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
描述
这个插件使用 KaTeX 库来渲染你的 HTML 文档中的数学排版。 你只需要将 language-math
扩展添加到任何你想渲染的数学内容中。在 markdown 页面中,这可以通过使用 math
语言的代码块来完成:
# 这是一个 markdown 文档
```math
c = \pm\sqrt{a^2 + b^2}
```
或者直接将 language-math
添加到包含代码的 HTML 元素:
<p class="language-math">
c = \pm\sqrt{a^2 + b^2}
</p>
安装
在你的 _config.ts
文件中导入此插件以使用它:
import lume from "lume/mod.ts";
import katex from "lume/plugins/katex.ts";
const site = lume();
site.use(katex(/* Options */));
export default site;
加载样式
为了在浏览器中渲染 katex
生成的任何 HTML,你将需要链接 CSS 文件并使用 HTML5 doctype。
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/katex@0.16.2/dist/katex.css"
/>
Note
有关更多信息,请参阅 KaTeX 站点文档中的 Browser usage。