Introduction

Nuxt Content is a powerful CMS for Vue.js developer to build content using Markdown. It made it convenient to write content, but it doesn't have LaTeX support right out of the box.

In this post, I will show you how to integrate LaTeX and start writing math equations in your nuxt content markdown files, so let's get started.

Instructions

First, we need to install two dependencies called remark-math and rehype-mathjax

npm install remark-math
npm install rehype-mathjax

Then, update your nuxt.config file to include those two library for our markdown property of the nuxt content

export default defineNuxtConfig({
  content: {
    markdown: {
      remarkPlugins: ["remark-math"],
      rehypePlugins: ["rehype-mathjax"],
    },
  },
});

That's it! You can now write LaTeX in markdown files for content. The equation should be enclosed by one or two dollar sign ($). You can try this equation out:

$$
\int_{a}^{b} f(x) \, dx = \lim_{n \to \infty} \sum_{i=1}^{n} f(x_i^*) \Delta x
$$

Result: