Nuxt

Full example on GitHub

Nuxt Content exposes markdown rehype plugins, so Lumis fits at the content pipeline layer.

Install

npm install @nuxt/content @lumis-sh/rehype-lumis @lumis-sh/lumis @lumis-sh/themes

Configure nuxt.config.ts

import {htmlInline} from '@lumis-sh/lumis/formatters'
import {bundledLanguages} from '@lumis-sh/lumis/bundles/web'
import githubLight from '@lumis-sh/themes/github_light'

export default defineNuxtConfig({
  modules: ['@nuxt/content'],
  content: {
    build: {
      markdown: {
        highlight: false,
        rehypePlugins: {
          '@lumis-sh/rehype-lumis': {
            options: {
              formatter: (language) => htmlInline({language, theme: githubLight}),
              languages: [bundledLanguages],
            },
          },
        },
      },
    },
  },
})

Disable Nuxt Content's built-in Shiki highlighting with highlight: false when Lumis owns code blocks.

The rehype plugin options must be nested under options because Nuxt Content's plugin loader expects { instance?, options? }.