LaTeX

Nextra 可以使用 KaTeX 直接在 MDX 中預先渲染 LaTeX 表達式，或使用 MathJax 在瀏覽器中動態渲染數學公式。要啟用 LaTeX 支援，您必須在 next.config.mjs 檔案中啟用 latex 選項。

import nextra from 'nextra'
 
const withNextra = nextra({
  latex: true
})
 
export default withNextra()

值 true 將使用 KaTeX 作為數學渲染器。要明確指定渲染器，您可以改為提供物件 { renderer: 'katex' } 或 { renderer: 'mathjax' } 作為 latex: ... 的值。

啟用後，所需的 CSS 和字體將自動包含在您的網站中，您可以開始編寫數學表達式，方法是將內聯數學公式括在 $...$ 中，或將顯示數學公式放在標記為 math 的程式碼區塊中。

```math
\int x^2
```

範例

例如，以下 Markdown 程式碼

The **Pythagorean equation** is $a=\sqrt{b^2 + c^2}$ and the quadratic formula:
 
```math
x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}
```

將渲染為

您仍然可以在與 LaTeX 表達式相同的行中使用 Markdown 和 MDX 語法。

API

KaTeX

rehype-katex 用於預先渲染內容中的 LaTeX 表達式。您可以透過 Nextra 設定中的 options 鍵傳遞支援的 KaTeX 選項。例如，要新增一個渲染為 \mathbb{R} 的巨集 \RR，您可以使用以下設定。

const withNextra = nextra({
  latex: {
    renderer: 'katex',
    options: {
      macros: {
        '\\RR': '\\mathbb{R}'
      }
    }
  }
})

請參閱 KaTeX 的文件以取得支援指令的清單。

MathJax

當啟用 MathJax 時（透過設定 latex: { renderer: 'mathjax' }），數學公式會在頁面載入時透過 better-react-mathjax 進行渲染，而不是預先渲染。 根據預設，**MathJax 是透過 MathJax CDN 提供服務的**，而不是直接包含在您的網站中的檔案。¹

MathJax 渲染是透過在 Nextra 設定中設定 renderer: 'mathjax' 來啟用的。

const withNextra = nextra({
  latex: {
    renderer: 'mathjax'
  }
})

您可以透過 Nextra 設定檔中的 options 鍵將額外選項傳遞給 better-react-mathjax。 config: ... 選項設定了 MathJax 設定。 然而，請注意，您只能透過 Nextra 設定檔中的 options 鍵將可序列化選項傳遞給 better-react-mathjax。²

例如，要將 MathJax 設定為將 \RR 渲染為 \mathbb{R}，您可以使用以下設定。

const withNextra = nextra({
  latex: {
    renderer: 'mathjax',
    options: {
      config: {
        tex: {
          macros: {
            RR: '\\mathbb{R}'
          }
        }
      }
    }
  }
})

MathJax CDN

預設情況下，MathJax 是透過 MathJax CDN 提供服務。要從其他位置（包括您專案中的本機）提供檔案，您必須將 src: ... 選項傳遞給 latex 設定。有關 src 選項的詳細資訊，請參閱 better-react-mathjax 文件。 此外，您可能需要將 MathJax 發行版複製到您的 /public 資料夾中，以便在本地提供服務。

KaTeX vs. MathJax

使用 KaTeX，數學公式會被預先渲染，這意味著無閃爍且更快的頁面載入速度。但是，KaTeX 不支援 MathJax 的所有功能，尤其是與輔助功能相關的功能。

以下兩個範例顯示了使用 KaTeX（第一個）和 MathJax（第二個）渲染的相同公式。

由於 MathJax 的輔助功能，第二個公式可以使用 Tab 鍵訪問，並且具有上下文選單，可幫助螢幕閱讀器為視障人士重新處理數學公式。