feat(docs-starter): update

peterroe · Aug 17, 2024 · aefea1e · aefea1e
1 parent fcb7ddc
commit aefea1e
Show file tree

Hide file tree

Showing 38 changed files with 16,487 additions and 3,846 deletions.
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/templates/docs-starter/.vitepress/config.ts b/templates/docs-starter/.vitepress/config.ts
@@ -1,5 +1,18 @@
+import { fileURLToPath } from 'node:url'
 import { defineConfig } from 'vitepress'
 import type { DefaultTheme } from 'vitepress/types'
+import multiTable from 'markdown-it-multimd-table'
+import magicLink from 'markdown-it-magic-link'
+import { transformerMetaWordHighlight, transformerNotationWordHighlight } from '@shikijs/transformers'
+import { defaultHoverInfoProcessor, transformerTwoslash } from '@shikijs/vitepress-twoslash'
+import type { Highlighter } from 'shiki'
+import { bundledThemes } from 'shiki'
+import mermaidPlugin from './plugin/mermaid'
+import langPlugin from './plugin/lang'
+import pmPlugin from './plugin/pm'
+import fileTreePlugin from './plugin/fileTree'
+import stepLinePlugin from './plugin/stepLine'
+import MagicMovePlugin from './plugin/magicMove'
 
 const title = 'Front End'
 const description = 'The docs template for the front end'
@@ -28,13 +41,16 @@ const SidebarGuide: DefaultTheme.SidebarItem[] = [
   },
 ]
 
+let shikiTmp: Highlighter
+
 export default defineConfig({
   lang: 'en-US',
   title,
   titleTemplate: title,
   description,
   outDir: './dist',
-  base: '/__pkg_name_placeholder__/',
+  // just need when you want to deploy to github
+  // base: '/__pkg_name_placeholder__/',
   head: [
     ['link', { rel: 'icon', href: '/__pkg_name_placeholder__/favicon.svg', type: 'image/svg+xml' }],
     ['link', { rel: 'alternate icon', href: '/__pkg_name_placeholder__/favicon.ico', type: 'image/png', sizes: '16x16' }],
@@ -43,6 +59,9 @@ export default defineConfig({
     ['meta', { name: 'og:description', content: description }],
     ['meta', { name: 'twitter:title', content: title }],
     ['meta', { name: 'twitter:card', content: 'summary_large_image' }],
+    ['link', { rel: 'search', type: 'application/opensearchdescription+xml', href: '/search.xml', title: 'Front End' }],
+    ['link', { rel: 'stylesheet', type: 'text/css', href: 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css' }],
+    ['script', { async: 'true', charset: 'utf-8', src: 'https://platform.twitter.com/widgets.js' }],
   ],
   lastUpdated: true,
   cleanUrls: true,
@@ -52,11 +71,110 @@ export default defineConfig({
     /:\/\/localhost/,
   ],
 
+  vite: {
+    resolve: {
+      alias: [
+        {
+          find: /^.*\/VPSwitchAppearance\.vue$/,
+          replacement: fileURLToPath(
+            new URL('./theme/components/VPSwitchAppearance.vue', import.meta.url),
+          ),
+        },
+      ],
+    },
+  },
+
   markdown: {
+    image: {
+      lazyLoading: true,
+    },
+    async shikiSetup(shiki) {
+      shikiTmp = shiki
+      await shiki.loadTheme(...Object.keys(bundledThemes) as any)
+    },
+    codeTransformers: [
+      transformerMetaWordHighlight(),
+      transformerNotationWordHighlight(),
+      {
+        // Render custom themes with codeblocks
+        name: 'shiki:inline-theme',
+        preprocess(code, options) {
+          const reg = /\btheme:([\w,-]+)\b/
+          const match = options.meta?.__raw?.match(reg)
+          if (!match?.[1])
+            return
+          const theme = match[1]
+          const themes = theme.split(',').map(i => i.trim())
+          if (!themes.length)
+            return
+          if (themes.length === 1) {
+            // @ts-expect-error anyway
+            delete options.themes
+            // @ts-expect-error anyway
+            options.theme = themes[0]
+          }
+          else if (themes.length === 2) {
+            // @ts-expect-error anyway
+            delete options.theme
+            // @ts-expect-error anyway
+            options.themes = {
+              light: themes[0],
+              dark: themes[1],
+            }
+          }
+          else {
+            throw new Error(`Only 1 or 2 themes are supported, got ${themes.length}`)
+          }
+          return code
+        },
+      },
+      {
+        name: 'shiki:inline-decorations',
+        preprocess(code, options) {
+          const reg = /^\/\/ @decorations:(.*?)\n/
+          code = code.replace(reg, (match, decorations) => {
+            options.decorations ||= []
+            options.decorations.push(...JSON.parse(decorations))
+            return ''
+          })
+          return code
+        },
+      },
+      transformerTwoslash({
+        // errorRendering: 'hover',
+        processHoverInfo(info) {
+          return defaultHoverInfoProcessor(info)
+            // Remove shiki_core namespace
+            .replace(/_shikijs_core[\w_]*\./g, '')
+        },
+      }),
+      {
+        name: 'shiki:remove-escape',
+        postprocess(code) {
+          return code.replace(/\[\\\!code/g, '[!code')
+        },
+      },
+    ],
     theme: {
       light: 'vitesse-light',
       dark: 'vitesse-dark',
     },
+    config(md) {
+      md.use(mermaidPlugin)
+      md.use(langPlugin)
+      md.use(pmPlugin)
+      md.use(fileTreePlugin)
+      md.use(stepLinePlugin)
+      md.use(MagicMovePlugin, shikiTmp)
+      md.use(magicLink)
+      md.use(multiTable, {
+        multiline: true,
+        rowspan: true,
+        headerless: true,
+        multibody: true,
+        aotolabel: true,
+      })
+    },
   },
 
   themeConfig: {
@@ -69,7 +187,7 @@ export default defineConfig({
       '/guide/': SidebarGuide,
     },
     editLink: {
-      pattern: 'https://github.com/peterroe/__pkg_name_placeholder__/edit/main/:paht',
+      pattern: 'https://github.com/peterroe/__pkg_name_placeholder__/edit/main/:path',
       text: 'Suggest changes to this page',
     },
     socialLinks: [