workaround twoslash

Author: kermanx

packages/slidev/node/syntax/markdown-it/markdown-it-shiki.ts

@@ -4,18 +4,28 @@ import { isTruthy } from '@antfu/utils'
 import { fromAsyncCodeToHtml } from '@shikijs/markdown-it/async'
 import { escapeVueInCode } from '../transform/utils'
 
-export default async function MarkdownItShiki({ data: { config }, mode, utils }: ResolvedSlidevOptions) {
-  const transformers = [
-    ...utils.shikiOptions.transformers || [],
-    (config.twoslash === true || config.twoslash === mode)
-    && (await import('@shikijs/vitepress-twoslash')).transformerTwoslash({
+export default async function MarkdownItShiki({ data: { config }, mode, utils: { shiki, shikiOptions } }: ResolvedSlidevOptions) {
+  async function getTwoslashTransformer() {
+    const [,,{ transformerTwoslash }] = await Promise.all([
+      // trigger the shiki to load the langs
+      shiki.codeToHast('', { lang: 'js', ...shikiOptions }),
+      shiki.codeToHast('', { lang: 'ts', ...shikiOptions }),
+
+      import('@shikijs/vitepress-twoslash'),
+    ])
+    return transformerTwoslash({
       explicitTrigger: true,
       twoslashOptions: {
         handbookOptions: {
           noErrorValidation: true,
         },
       },
-    }),
+    })
+  }
+
+  const transformers = [
+    ...shikiOptions.transformers || [],
+    (config.twoslash === true || config.twoslash === mode) && await getTwoslashTransformer(),
     {
       pre(pre) {
         this.addClassToHast(pre, 'slidev-code')
@@ -27,8 +37,8 @@ export default async function MarkdownItShiki({ data: { config }, mode, utils }:
     } satisfies ShikiTransformer,
   ].filter(isTruthy) as ShikiTransformer[]
 
-  return fromAsyncCodeToHtml(utils.shiki.codeToHtml, {
-    ...utils.shikiOptions,
+  return fromAsyncCodeToHtml(shiki.codeToHtml, {
+    ...shikiOptions,
     transformers,
   })
 }

packages/types/src/options.ts

@@ -1,6 +1,6 @@
 import type { MarkdownItShikiOptions } from '@shikijs/markdown-it'
 import type { KatexOptions } from 'katex'
-import type { ShorthandsBundle } from 'shiki/core'
+import type { CodeOptionsThemes, ShorthandsBundle } from 'shiki/core'
 import type { SlidevData } from './types'
 
 export interface RootsInfo {
@@ -58,7 +58,7 @@ export interface ResolvedSlidevOptions extends RootsInfo, SlidevEntryOptions {
 
 export interface ResolvedSlidevUtils {
   shiki: ShorthandsBundle<string, string>
-  shikiOptions: MarkdownItShikiOptions
+  shikiOptions: MarkdownItShikiOptions & CodeOptionsThemes
   katexOptions: KatexOptions | null
   indexHtml: string
   define: Record<string, string>