Overview

The theme has built-in support for mathematical formulas.

This feature is powered by @vuepress/plugin-markdown-math. You can choose to render mathematical formulas in markdown using the following methods:

• katex (default)
• mathjax

Usage

.vuepress/config.ts

export default defineUserConfig({
  theme: plumeTheme({
    markdown: {
      math: {
        type: 'katex', // 'katex' | 'mathjax'
        // ... Other configuration options
      }
    },
  })
})

When you choose to use mathjax, you also need to install the dependency by running the following command:

npm

npm i @mathjax/src

pnpm

pnpm add @mathjax/src

yarn

yarn add @mathjax/src

Syntax

Inline Syntax

Use $ to wrap mathematical formulas (i.e., write the mathematical formula between two $ symbols)

Euler's identity $e^{i\pi}+1=0$ is a beautiful formula in $\mathbb{R}^2$.

Inline Mode

Euler's identity $e^{i\pi}+1=0$ is a beautiful formula in $\mathbb{R}^2$.

Block Syntax

Use $$ to wrap mathematical formulas (i.e., write the mathematical formula between two $$ symbols)

<!-- Write the mathematical formula between two `$$` symbols, rendered in a separate block -->
$$xxx$$

<!-- The two `$$` symbols can each occupy a separate line, with the mathematical formula between them -->
$$
xxx
$$

$$\frac {\partial^r} {\partial \omega^r} \left(\frac {y^{\omega}} {\omega}\right) = \left(\frac {y^{\omega}} {\omega}\right) \left\{(\log y)^r + \sum_{i=1}^r \frac {(-1)^ Ir \cdots (r-i+1) (\log y)^{ri}} {\omega^i} \right\}$$

Block Mode

$$
\frac {\partial^r} {\partial \omega^r} \left(\frac {y^{\omega}} {\omega}\right)
= \left(\frac {y^{\omega}} {\omega}\right) \left\{(\log y)^r + \sum_{i=1}^r \frac {(-1)^ Ir \cdots (r-i+1) (\log y)^{ri}} {\omega^i} \right\}
$$

Related Tutorials

TeX

TeX TutorialTeX Cheat Sheet

KaTeX

KaTeX Supported FeaturesKaTeX Support Table

MathJax

Supported TeX / KaTeX Commands

Configuration Options

Name:type

Optional

Type:'katex' | 'mathjax'

Default:'katex'

Package used to render $\TeX$ content.

• 'katex': Use KaTeX
• 'mathjax': Use MathJax

Name:delimiters

Optional

Type:'brackets' | 'dollars' | 'all'

Default:'dollars'

Enabled math delimiter syntax.

• "brackets": Use \(...\) for inline math and \[...\] for display mode math (LaTeX style)
• "dollars": Use $...$ for inline math and $$...$$ for display mode math (common Markdown style)
• "all": Enable both bracket and dollar sign syntax

Using KaTeX

When using KaTeX, any other options will be passed to KaTeX as KatexOptions. For all available options, refer to the KaTeX documentation.

Additionally, 2 special options are supported:

Name:copy

Optional

Type:boolean

Whether to enable the copy extension.

Name:mhchem

Optional

Type:boolean

Whether to enable the mhchem extension.

Using MathJax

When using MathJax, you can set:

Name:tex

Optional

Type:object

Options passed to the TeX input parser.

Name:output

Optional

Type:'svg' | 'chtml'

Default:'svg'

Output format, either SVG or Common HTML.

Name:chtml

Optional

Type:object

Options passed to the Common HTML output parser.

Name:svg

Optional

Type:object

Options passed to the SVG output parser.

Contributors

pengzhanbo

Changelog

9/12/26, 10:04 AM

View All Changelog

• 7a454-feat(plugin-md-power): drop optional tag in field container (#987)on 9/12/26
• 1d04d-feat: add builtin auto-import-components (#932)on 9/9/26
• 16c2d-docs: update field containeron 6/8/26
• db8a4-docs: optimize and completion docs (#766)on 12/1/25

Edit this page

Previous pageemoji

Next pageTable Enhancement