install and use shikiji

src/hooks/useMarkdown.hook.ts

@@ -6,6 +6,7 @@ import markdownItCheckbox from 'markdown-it-checkbox'
 import markdownItFootnote from 'markdown-it-footnote'
 import markdownItIframe from 'markdown-it-iframe'
 import markdownItLatex from 'markdown-it-latex'
+import Shikiji from 'markdown-it-shikiji'
 import { Ref, toValue } from 'vue'
 
 import { decodeBase64ToUTF8 } from '@/utils/decodeBase64ToUTF8'
@@ -40,6 +41,18 @@ const md = new MarkdownIt({
     height: 400
   })
 
+const useShikiji = async () => {
+  const shikiji = await Shikiji({
+    themes: {
+      light: 'vitesse-light',
+      dark: 'vitesse-black'
+    }
+  })
+  md.use(shikiji)
+}
+
+useShikiji()
+
 const rules: Renderer.RenderRuleRecord = {
   table_close: () => '</table>\n</div>',
   table_open: () =>

src/shims-vue.d.ts

@@ -11,4 +11,5 @@ declare module 'markdown-it-footnote'
 declare module 'markdown-it-regexp'
 declare module 'markdown-it-latex'
 declare module 'markdown-it-iframe'
+declare module 'markdown-it-shikiji'
 declare module '@rushstack/eslint-patch/modern-module-resolution'