feat: Add Markdown Page route and component

vite.config.ts

@@ -1,5 +1,5 @@
 import { VantResolver } from '@vant/auto-import-resolver';
-import vue from '@vitejs/plugin-vue';
+import Vue from '@vitejs/plugin-vue';
 import vueJsx from '@vitejs/plugin-vue-jsx';
 import { fileURLToPath, URL } from 'node:url';
 import UnoCSS from 'unocss/vite';
@@ -12,6 +12,7 @@ import VueRouter from 'unplugin-vue-router/vite';
 import { defineConfig, loadEnv } from 'vite';
 import cdnImport from 'vite-plugin-cdn-import';
 import vueDevTools from 'vite-plugin-vue-devtools';
+import { unheadVueComposablesImports } from '@unhead/vue';
 
 // https://vitejs.dev/config/
 export default defineConfig(({ mode, command }) => {
@@ -39,9 +40,13 @@ export default defineConfig(({ mode, command }) => {
             importStyle: true,
           }),
         ],
-        imports: ['pinia', 'vue', VueRouterAutoImports],
+        imports: ['pinia', 'vue', VueRouterAutoImports, unheadVueComposablesImports],
       }),
       Components({
+        // allow auto load markdown components under `./src/components/`
+        extensions: ['vue', 'md'],
+        // allow auto import and register components used in markdown
+        include: [/\.vue$/, /\.vue\?vue/, /\.md$/],
         resolvers: [
           TDesignResolver({
             library: 'mobile-vue',
@@ -53,9 +58,13 @@ export default defineConfig(({ mode, command }) => {
         ],
       }),
       UnoCSS(),
-      vue(),
+      Vue({
+        include: [/\.vue$/, /\.md$/], // <-- allows Vue to compile Markdown files
+      }),
       vueJsx(),
-      Markdown({}),
+      Markdown({
+        headEnabled: true,
+      }),
       vueDevTools(),
       cdnImport({
         // https://github.com/mmf-fe/vite-plugin-cdn-import/blob/HEAD/README.zh-CN.md