\{\{ in KateX is mistakenly interpreted as a JS code.

[geraw]

Describe the bug

Inside LaTeX math expressions in Slidev ($...$ or $$...$$), any occurrence of \{\{ is incorrectly treated by Vue's template compiler as the beginning of a mustache interpolation block ({{ ... }}).
As a result, the math formula breaks, parts of it disappear, or Slidev shows a compile error.

In LaTeX, \{\{ is a valid way to typeset literal braces or appears inside certain macro uses, so it should be passed through to KaTeX/MathJax unchanged.
Instead, Slidev/Vite parses it too early as a Vue template expression.

Expected behavior

\{\{ inside math mode should not be interpreted as Vue {{ ... }} interpolation and should be forwarded verbatim to the math engine.

---

Minimal reproduction

1. Create a new Slidev project (npm create slidev@latest or https://sli.dev/new)

2. Add a slide with the following content:

   $$
   f(x) = \{\{ x \}\}
   $$

3. Run npm run dev

4. The slide fails to render because Vue treats {{ x }} as a mustache expression instead of literal math.

---

Environment

• Slidev version: v52.4.0
• Browser: Chrome
• OS: Windows 10

[geraw]

Workaround

As a temporary workaround, I added a custom Markdown transformer that escapes \{\{ inside LaTeX math blocks before Vue’s compiler processes the file.
This prevents Vue from interpreting {{ ... }} as a mustache expression inside math environments.

// setup/transformers.ts
// Custom transformer to escape double opening braces inside math environments.

import { defineTransformersSetup } from '@slidev/types'
import type { MarkdownTransformContext } from '@slidev/types'

function escapeBracesInMath(source: string): string {
  // Display math
  source = source.replace(/\$\$([\s\S]*?)\$\$/g, (_m, inner) => {
    const replaced = inner.replace(/\\{\s*\\{/g, '\\{\\!\\{')
    return `$$${replaced}$$`
  })

  // Inline math
  source = source.replace(/(?<!\$)\$([^\n]*?)\$(?!\$)/g, (_m, inner) => {
    const replaced = inner.replace(/\\{\s*\\{/g, '\\{\\!\\{')
    return `$${replaced}$`
  })

  return source
}

export default defineTransformersSetup(() => ({
  pre: [
    (ctx: MarkdownTransformContext) => {
      const orig = ctx.s.toString()
      const edited = escapeBracesInMath(orig)
      if (edited !== orig) {
        ctx.s.overwrite(0, orig.length, edited)
      }
    },
  ],
}))

This ensures that \{\{ inside math is preserved correctly, but it is only a workaround. Ideally, Slidev/Vite/Vue should allow math content to bypass Vue template parsing entirely.

[kermanx]

This should have been fixed in #2347. Please try the latest version.