docs: autoimport docs components

docs/.vitepress/theme/index.ts

@@ -2,11 +2,6 @@ import 'uno.css'
 // .vitepress/theme/index.ts
 import DefaultTheme from 'vitepress/theme'
 import './config.css'
-import FirstScene from './components/FirstScene.vue'
-
-import StackBlitzEmbed from './components/StackBlitzEmbed.vue'
-import EmbedExperiment from './components/EmbedExperiment.vue'
-import DonutExample from './components/DonutExample.vue'
 
 import TresLayout from './TresLayout.vue'
 
@@ -26,11 +21,6 @@ export default {
 
   enhanceApp(ctx) {
     DefaultTheme.enhanceApp(ctx)
-    ctx.app.component('FirstScene', FirstScene)
-    ctx.app.component('StackBlitzEmbed', StackBlitzEmbed)
-    ctx.app.component('EmbedExperiment', EmbedExperiment)
-    ctx.app.component('DonutExample', DonutExample)
-
     /* ctx.app.use(plausible) */
   },
   Layout: TresLayout,

docs/components.d.ts

@@ -0,0 +1,22 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+import '@vue/runtime-core'
+
+export {}
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    DonutExample: typeof import('./.vitepress/theme/components/DonutExample.vue')['default']
+    EmbedExperiment: typeof import('./.vitepress/theme/components/EmbedExperiment.vue')['default']
+    ExtendExample: typeof import('./.vitepress/theme/components/ExtendExample.vue')['default']
+    FirstScene: typeof import('./.vitepress/theme/components/FirstScene.vue')['default']
+    FirstSceneLightToon: typeof import('./.vitepress/theme/components/FirstSceneLightToon.vue')['default']
+    LoveVueThreeJS: typeof import('./.vitepress/theme/components/LoveVueThreeJS.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    StackBlitzEmbed: typeof import('./.vitepress/theme/components/StackBlitzEmbed.vue')['default']
+  }
+}

docs/vite.config.ts

@@ -1,7 +1,19 @@
 import { defineConfig } from 'vite'
 import Unocss from 'unocss/vite'
 import svgLoader from 'vite-svg-loader'
+import Components from 'unplugin-vue-components/vite'
 
 export default defineConfig({
-  plugins: [svgLoader(), Unocss()],
+  plugins: [
+    svgLoader(),
+    Unocss(),
+    Components({
+      // allow auto load markdown components under `.vitepress/theme/components`
+      dirs: ['.vitepress/theme/components'],
+      extensions: ['vue', 'md'],
+      // allow auto import and register components used in markdown
+      include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
+      dts: 'components.d.ts',
+    }),
+  ],
 })