diff --git a/src/node/markdown/plugins/highlight.ts b/src/node/markdown/plugins/highlight.ts index aadd433813f..9f0c807c131 100644 --- a/src/node/markdown/plugins/highlight.ts +++ b/src/node/markdown/plugins/highlight.ts @@ -6,7 +6,6 @@ import { createRangeProcessor, getHighlighter, Processor, - addClass, defineProcessor } from 'shiki-processor' import type { ThemeOptions } from '../markdown' @@ -69,7 +68,8 @@ export async function highlight( processors }) - const styleRE = /
/
+  const classRE = /]*class="(.*?)"/
+  const styleRE = /]*(style=".*?")/
   const preRE = /^/
   const vueRE = /-vue$/
 
@@ -93,29 +93,21 @@ export async function highlight(
       )
     }
 
-    const dark = addClass(
-      cleanup(
-        highlighter.codeToHtml(str, {
-          lang,
-          lineOptions,
-          theme: getThemeName(theme.dark)
-        })
-      ),
-      'vp-code-dark',
-      'pre'
-    )
+    const dark = cleanup(
+      highlighter.codeToHtml(str, {
+        lang,
+        lineOptions,
+        theme: getThemeName(theme.dark)
+      })
+    ).replace(classRE, (_, cls) => _.replace(cls, 'vp-code-dark'))
 
-    const light = addClass(
-      cleanup(
-        highlighter.codeToHtml(str, {
-          lang,
-          lineOptions,
-          theme: getThemeName(theme.light)
-        })
-      ),
-      'vp-code-light',
-      'pre'
-    )
+    const light = cleanup(
+      highlighter.codeToHtml(str, {
+        lang,
+        lineOptions,
+        theme: getThemeName(theme.light)
+      })
+    ).replace(classRE, (_, cls) => _.replace(cls, 'vp-code-light'))
 
     return dark + light
   }