显示数学公式块

聊聊如何让 VuePress 显示数学公式块。

什么是数学公式块

如果你还不了解，可以先看看我的 Markdown 教程——Markdown 与数学公式。

安装依赖

相关插件有很多，我这里选择的是 markdown-it-mathjax3：

npm i markdown-it-mathjax3

配置

在 config.ts 里配置（看 plugins 里的配置）：

module.exports = {
  // 省略其他配置
  markdown: {
    lineNumbers: true,
    extractHeaders: ["h2", "h3", "h4"],
    externalLinks: { target: '_blank', rel: 'nofollow noopener noreferrer' },
    plugins: [
      'markdown-it-mathjax3'
    ]
  }
  
}

效果

效果当然就是能正常渲染公式块了，参考我的 Markdown 教程——Markdown 与数学公式，里面有很多数学公式。

注意

注意：$ 和公式之间不能有空格，例如这样的写法是不能正常渲染的（末尾的 a 和 $ 有空格）：

$\alpha $

参考

vdoing 主题微信群的群友指导

Markdown 增强插件 (opens new window)

markdown-it-mathjax3 插件 (opens new window)

markdown-it-katex 插件 (opens new window)