@movk/nuxt-docs 1.15.0 → 1.16.0

package/README.md

@@ -189,7 +189,10 @@ pnpm add mermaid dompurify
 ```ts [nuxt.config.ts]
 export default defineNuxtConfig({
   extends: ['@movk/nuxt-docs'],
-  mermaid: { enabled: true }
+
+  movkNuxtDocs: {
+    mermaid: true
+  }
 })
 ```
 
@@ -225,6 +228,20 @@ graph TD
 - **Git 图**（`gitGraph`）：用于展示分支历史
 - 以及更多 [Mermaid 支持的图表类型](https://mermaid.js.org/intro())
 
+### 无障碍支持（A11y）
+
+Movk Nuxt Docs 默认启用 `@nuxt/a11y`。如需关闭，可在 `movkNuxtDocs` 中设置：
+
+```ts [nuxt.config.ts]
+export default defineNuxtConfig({
+  extends: ['@movk/nuxt-docs'],
+
+  movkNuxtDocs: {
+    a11y: false
+  }
+})
+```
+
 ## 🛠️ 开发
 
 ### 本地开发

package/app/components/OgImage/OgImageDocs.takumi.vue

@@ -11,10 +11,7 @@ withDefaults(defineProps<{
 </script>
 
 <template>
-  <div
-    style="font-family: 'Public Sans', 'Noto Sans SC', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;"
-    class="w-full h-full flex flex-col justify-center items-center relative p-10 lg:p-15 bg-white text-neutral-900 dark:bg-neutral-900 dark:text-neutral-50"
-  >
+  <div style="font-family: 'Noto Sans SC', sans-serif;" class="w-full h-full flex flex-col justify-center items-center relative p-10 lg:p-15 bg-white text-neutral-900 dark:bg-neutral-900 dark:text-neutral-50">
     <div
       class="absolute top-0 left-0 right-0 bottom-0"
       :style="{
@@ -82,7 +79,10 @@ withDefaults(defineProps<{
         </h1>
       </div>
 
-      <p v-if="description" class="text-slate-500 text-[24px] lg:text-[32px] opacity-70 max-w-162.5 lg:max-w-225 leading-normal">
+      <p
+        v-if="description"
+        class="text-slate-500 text-[24px] lg:text-[32px] opacity-70 max-w-162.5 lg:max-w-225 leading-normal"
+      >
         {{ description }}
       </p>
     </div>

package/modules/config.ts

@@ -1,27 +1,9 @@
-import { existsSync } from 'node:fs'
 import { createResolver, defineNuxtModule } from '@nuxt/kit'
 import { defu } from 'defu'
-import { join } from 'pathe'
 import { getGitBranch, getGitEnv, getLocalGitInfo } from '../utils/git'
 import { getPackageJsonMetadata, inferSiteURL } from '../utils/meta'
 import { createComponentMetaExcludeFilters } from '../utils/component-meta'
 
-function getMdcConfigSources(nuxt: any): string[] {
-  return nuxt.options._layers.flatMap((layer: any) => {
-    const tsConfigPath = join(layer.config.srcDir, 'mdc.config.ts')
-    if (existsSync(tsConfigPath)) {
-      return [tsConfigPath]
-    }
-
-    const jsConfigPath = join(layer.config.srcDir, 'mdc.config.js')
-    if (existsSync(jsConfigPath)) {
-      return [jsConfigPath]
-    }
-
-    return []
-  })
-}
-
 export default defineNuxtModule({
   meta: {
     name: 'config'
@@ -91,10 +73,12 @@ export default defineNuxtModule({
       ]
     })
 
-    // Load mdc.config from all layers
-    const mdcConfigSources = getMdcConfigSources(nuxt)
-    if (mdcConfigSources.length > 0) {
-      await nuxt.callHook('mdc:configSources', mdcConfigSources)
-    }
+    nuxt.hook('nitro:config', (nitroConfig) => {
+      nitroConfig.publicAssets ||= []
+      nitroConfig.publicAssets.push({
+        dir: resolve('./runtime/public'),
+        maxAge: 60 * 60 * 24 * 30
+      })
+    })
   }
 })

package/modules/module.ts

@@ -0,0 +1,103 @@
+import { addComponentsDir, createResolver, defineNuxtModule, logger } from '@nuxt/kit'
+import type { ModuleDependencies } from 'nuxt/schema'
+
+export interface ModuleOptions {
+  /**
+   * 是否启用 @nuxt/a11y 无障碍支持
+   * @defaultValue true
+   * @see https://a11y.nuxtjs.org/
+   */
+  a11y?: boolean
+  /**
+   * 是否启用 Mermaid 图表支持
+   * - 启用前需安装依赖: `pnpm add mermaid dompurify`
+   * @defaultValue false
+   */
+  mermaid?: boolean
+}
+
+const log = logger.withTag('movk-nuxt-docs')
+
+export default defineNuxtModule<ModuleOptions>({
+  meta: {
+    name: 'movk-nuxt-docs',
+    configKey: 'movkNuxtDocs'
+  },
+  defaults: {
+    a11y: true,
+    mermaid: false
+  },
+  moduleDependencies(nuxt): ModuleDependencies {
+    const userOptions = nuxt.options.movkNuxtDocs || {}
+    return {
+      ...userOptions.a11y !== false && {
+        '@nuxt/a11y': {
+          version: '^1.0.0-alpha.1'
+        }
+      }
+    }
+  },
+  setup(options, nuxt) {
+    const { resolve } = createResolver(import.meta.url)
+
+    if (options.mermaid) {
+      let mermaidAvailable = true
+      try {
+        import.meta.resolve('mermaid')
+      } catch {
+        log.warn('mermaid package not found. install it with: pnpm add mermaid dompurify')
+        mermaidAvailable = false
+      }
+
+      if (mermaidAvailable) {
+        addComponentsDir({
+          path: resolve('./runtime/components/prose'),
+          pathPrefix: false,
+          prefix: 'Prose',
+          global: true
+        })
+
+        // 添加 mermaid 语言高亮
+        const contentOptions = nuxt.options.content as Record<string, any> | false
+        if (contentOptions) {
+          const build = contentOptions.build ??= {}
+          const markdown = build.markdown ??= {}
+          const highlight = markdown.highlight ??= {}
+          const langs = highlight.langs ??= [] as string[]
+          if (!langs.includes('mermaid')) {
+            langs.push('mermaid')
+          }
+        }
+
+        // 为 mermaid ESM 兼容性配置 optimizeDeps
+        nuxt.hooks.hook('vite:extendConfig', (config) => {
+          const cfg = config as { optimizeDeps?: { include?: string[] } }
+          cfg.optimizeDeps ??= {}
+          cfg.optimizeDeps.include ??= []
+          cfg.optimizeDeps.include.push(
+            '@movk/nuxt-docs > mermaid',
+            '@movk/nuxt-docs > mermaid > dayjs',
+            '@movk/nuxt-docs > mermaid > @braintree/sanitize-url',
+            '@movk/nuxt-docs > mermaid > d3',
+            '@movk/nuxt-docs > mermaid > dompurify'
+          )
+        })
+
+        // 注入 mermaid 代码图标配置到 appConfig
+        const appConfig = nuxt.options.appConfig as Record<string, any>
+        appConfig.ui ??= {}
+        appConfig.ui.prose ??= {}
+        appConfig.ui.prose.codeIcon ??= {}
+        appConfig.ui.prose.codeIcon.mmd ??= 'i-vscode-icons-file-type-mermaid'
+
+        log.info('mermaid diagram support enabled')
+      }
+    }
+  }
+})
+
+declare module 'nuxt/schema' {
+  interface NuxtConfig {
+    movkNuxtDocs?: ModuleOptions
+  }
+}

package/{app/components/content/prose/ProsePre.global.vue → modules/runtime/components/prose/Pre.vue}

@@ -1,16 +1,13 @@
 <script setup lang="ts">
 import type { ProsePreProps } from '@nuxt/ui'
-// @ts-ignore
+// @ts-ignore - #build alias only available at Nuxt build time
 import NuxtUIProsePre from '@nuxt/ui/components/prose/Pre.vue'
 
 const props = defineProps<ProsePreProps>()
 
-const isMermaid = computed(() => props.language === 'mermaid')
-
-// 动态解析 Mermaid 组件（仅在 mermaid 模块启用时可用）
 const MermaidComponent = computed(() => {
-  if (!isMermaid.value) return null
-  const resolved = resolveComponent('Mermaid')
+  if (props.language !== 'mermaid') return null
+  const resolved = resolveComponent('ProseMermaid')
   return typeof resolved === 'string' ? null : resolved
 })
 </script>
@@ -18,11 +15,12 @@ const MermaidComponent = computed(() => {
 <template>
   <component
     :is="MermaidComponent"
-    v-if="isMermaid && MermaidComponent"
+    v-if="MermaidComponent"
     :code="props.code || ''"
     :filename="props.filename"
     :icon="props.icon"
   />
+
   <NuxtUIProsePre v-else v-bind="props">
     <slot />
   </NuxtUIProsePre>

package/nuxt.config.ts

@@ -20,7 +20,6 @@ export default defineNuxtConfig({
     '@nuxt/fonts',
     '@nuxt/content',
     '@nuxt/image',
-    '@nuxt/a11y',
     '@nuxtjs/robots',
     '@nuxtjs/mcp-toolkit',
     '@vueuse/nuxt',
@@ -172,10 +171,9 @@ export default defineNuxtConfig({
   },
 
   fonts: {
-    provider: 'bunny',
     families: [
-      { name: 'Public Sans', global: true, fallbacks: ['Noto Sans SC', 'sans-serif'] },
-      { name: 'Noto Sans SC', global: true }
+      { name: 'Public Sans', global: true, provider: 'bunny' },
+      { name: 'Noto Sans SC', global: true, provider: 'local' }
     ]
   },
 

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@movk/nuxt-docs",
   "type": "module",
-  "version": "1.15.0",
+  "version": "1.16.0",
   "private": false,
   "description": "Modern Nuxt 4 documentation theme with auto-generated component docs, AI chat assistant, MCP server, and complete developer experience optimization.",
   "author": "YiXuan <mhaibaraai@gmail.com>",
@@ -39,10 +39,10 @@
     "README.md"
   ],
   "dependencies": {
-    "@ai-sdk/gateway": "^3.0.79",
+    "@ai-sdk/gateway": "^3.0.83",
     "@ai-sdk/mcp": "^1.0.30",
-    "@ai-sdk/vue": "^3.0.137",
-    "@iconify-json/lucide": "^1.2.98",
+    "@ai-sdk/vue": "^3.0.140",
+    "@iconify-json/lucide": "^1.2.100",
     "@iconify-json/simple-icons": "^1.2.75",
     "@iconify-json/vscode-icons": "^1.2.45",
     "@movk/core": "^1.2.2",
@@ -52,8 +52,8 @@
     "@nuxt/kit": "^4.4.2",
     "@nuxt/ui": "^4.6.0",
     "@nuxtjs/mcp-toolkit": "^0.12.0",
-    "@nuxtjs/mdc": "^0.20.2",
-    "@nuxtjs/robots": "^5.7.1",
+    "@nuxtjs/mdc": "^0.21.0",
+    "@nuxtjs/robots": "^6.0.6",
     "@octokit/rest": "^22.0.1",
     "@shikijs/core": "^4.0.2",
     "@shikijs/engine-javascript": "^4.0.2",
@@ -63,14 +63,14 @@
     "@takumi-rs/wasm": "^0.73.1",
     "@vueuse/core": "^14.2.1",
     "@vueuse/nuxt": "^14.2.1",
-    "ai": "^6.0.137",
+    "ai": "^6.0.141",
     "defu": "^6.1.4",
     "exsolve": "^1.0.8",
     "git-url-parse": "^16.1.0",
     "motion-v": "^2.2.0",
     "nuxt-component-meta": "^0.17.2",
     "nuxt-llms": "^0.2.0",
-    "nuxt-og-image": "^6.1.2",
+    "nuxt-og-image": "^6.2.6",
     "ohash": "^2.0.11",
     "pathe": "^2.0.3",
     "pkg-types": "^2.3.0",

package/utils/component-meta.ts

@@ -52,11 +52,7 @@ export function createComponentMetaExcludeFilters(
     resolve('../app/components/content/ComponentProps.vue'),
     resolve('../app/components/content/ComponentSlots.vue'),
     resolve('../app/components/content/PageLastCommit.vue'),
-    resolve('../app/components/content/Mermaid.vue'),
-    resolve('./ai-chat/runtime/components/AiChatToolCall.vue'),
-    resolve('./ai-chat/runtime/components/AiChatReasoning.vue'),
-    resolve('./ai-chat/runtime/components/AiChatSlideoverFaq.vue'),
-    resolve('./ai-chat/runtime/components/AiChatPreStream.vue')
+    resolve('./runtime/components/prose/Mermaid.vue')
   ]
 
   const userComponentPaths = [

package/modules/mermaid.ts

@@ -1,93 +0,0 @@
-import { createResolver, defineNuxtModule, logger } from '@nuxt/kit'
-
-export interface MermaidModuleOptions {
-  /**
-   * 是否启用 Mermaid 图表支持
-   *
-   * 启用前需安装依赖: `pnpm add mermaid dompurify`
-   * @default false
-   */
-  enabled?: boolean
-}
-
-const log = logger.withTag('movk-nuxt-docs')
-
-export default defineNuxtModule<MermaidModuleOptions>({
-  meta: {
-    name: 'mermaid',
-    configKey: 'mermaid'
-  },
-  defaults: {
-    enabled: false
-  },
-  setup(options, nuxt) {
-    const { resolve } = createResolver(import.meta.url)
-    const mermaidFilePath = resolve('../app/components/content/Mermaid.vue')
-
-    // Layer 自动扫描会注册 Mermaid.vue，通过 components:extend 统一管理：
-    // - 禁用时：从列表移除，resolveComponent('Mermaid') 返回字符串，ProsePre fallback 到普通代码块
-    // - 启用时：将 mode 改为 'client'，避免 SSR 阶段执行
-    nuxt.hooks.hook('components:extend', (components) => {
-      const idx = components.findIndex(c => c.filePath === mermaidFilePath)
-      if (idx === -1) return
-
-      if (!options.enabled) {
-        components.splice(idx, 1)
-        return
-      }
-
-      components[idx]!.mode = 'client'
-    })
-
-    if (!options.enabled) return
-
-    // 验证 mermaid 依赖是否已安装
-    try {
-      import.meta.resolve('mermaid')
-    } catch {
-      log.warn('[mermaid] `mermaid` package not found. Install it with: pnpm add mermaid dompurify')
-      return
-    }
-
-    // 添加 mermaid 语言高亮
-    const contentOptions = nuxt.options.content as Record<string, any> | false
-    if (contentOptions) {
-      const build = contentOptions.build ??= {}
-      const markdown = build.markdown ??= {}
-      const highlight = markdown.highlight ??= {}
-      const langs = highlight.langs ??= [] as string[]
-      if (!langs.includes('mermaid')) {
-        langs.push('mermaid')
-      }
-    }
-
-    // 为 mermaid ESM 兼容性配置 optimizeDeps
-    nuxt.hooks.hook('vite:extendConfig', (config) => {
-      const cfg = config as { optimizeDeps?: { include?: string[] } }
-      cfg.optimizeDeps ??= {}
-      cfg.optimizeDeps.include ??= []
-      cfg.optimizeDeps.include.push(
-        '@movk/nuxt-docs > mermaid',
-        '@movk/nuxt-docs > mermaid > dayjs',
-        '@movk/nuxt-docs > mermaid > @braintree/sanitize-url',
-        '@movk/nuxt-docs > mermaid > d3',
-        '@movk/nuxt-docs > mermaid > dompurify'
-      )
-    })
-
-    // 注入 mermaid 代码图标配置到 appConfig
-    const appConfig = nuxt.options.appConfig as Record<string, any>
-    appConfig.ui ??= {}
-    appConfig.ui.prose ??= {}
-    appConfig.ui.prose.codeIcon ??= {}
-    appConfig.ui.prose.codeIcon.mmd ??= 'i-vscode-icons-file-type-mermaid'
-
-    log.info('[mermaid] Mermaid diagram support enabled')
-  }
-})
-
-declare module 'nuxt/schema' {
-  interface NuxtConfig {
-    mermaid?: MermaidModuleOptions
-  }
-}