Katex-vue

A Vue component for LaTeX expression rendering using KaTeX. More information in Katex Vue

• 🔧 Configurable global defaults
• 📦 Supports both SSR and CSR
• ⚡️ Optimized rendering performance
• 🔄 Reactive expression updates

Using npm

$ npm add -D katex katex-vue

Using pnpm

$ pnpm add -D katex katex-vue

Using yarn

$ yarn add -D katex katex-vue

Using bun

$ bun add -D katex katex-vue

import {createApp} from 'vue'
import KatexVue from 'katex-vue'

const app = createApp()
app.use(KatexVue, {
    // your global default config
    displayMode: true,
    errorColor: '#ff5500'
})

<script setup>
  import {KatexVue} from 'katex-vue'

  const expression = "\\int_0^\\infty x^2 \\mathrm{d} x"
</script>

<template>
  <katex-vue :expression="expression" displayMode/>
</template>

Priority: Component props > Global config > Default values

Check on KaTeX Document

MIT © 2025 Infoc