Scalar API 参考文档 Nuxt 模块

此插件提供了一种简单的方法，使用 Nuxt 基于 OpenAPI/Swagger 文件渲染美观的 API 参考文档。

快速设置

使用一个命令将模块安装到您的 Nuxt 应用程序

npx nuxi module add @scalar/nuxt

就是这样！您现在可以在您的 Nuxt 应用程序中使用 @scalar/nuxt ✨

配置

如果您正在使用 nuxt 服务器路由，您可以通过在 nuxt.config.ts 的 nitro 配置中启用 openAPI 来简单地启用 scalar

export default defineNuxtConfig({
  modules: ['@scalar/nuxt'],
  nitro: {
    experimental: {
      openAPI: true,
    },
  },
})

如果您想添加您自己的 OpenAPI 文档，您可以使用以下最小配置

export default defineNuxtConfig({
  modules: ['@scalar/nuxt'],
  scalar: {
    spec: {
      url: 'https://cdn.jsdelivr.net.cn/npm/@scalar/galaxy/dist/latest.yaml',
    },
  },
})

默认情况下，文档将托管在 /docs，但您可以轻松自定义它，这是一个更深入的配置示例。

export default defineNuxtConfig({
  modules: ['@scalar/nuxt'],
  scalar: {
    darkMode: true,
    hideModals: false,
    hideDownloadButton: false,
    metaData: {
      title: 'API Documentation by Scalar',
    },
    proxyUrl: 'https://proxy.scalar.com',
    searchHotKey: 'k',
    showSidebar: true,
    pathRouting: {
      basePath: '/scalar',
    },
    spec: {
      url: 'https://cdn.jsdelivr.net.cn/npm/@scalar/galaxy/dist/latest.yaml',
    },
  },
})

对于多个参考文档，传入一个配置对象数组，这些对象扩展在基本配置之上。

export default defineNuxtConfig({
  modules: ['@scalar/nuxt'],
  scalar: {
    darkMode: true,
    metaData: {
      title: 'API Documentation by Scalar',
    },
    proxyUrl: 'https://proxy.scalar.com',
    configurations: [
      {
        spec: {
          url: 'https://cdn.jsdelivr.net.cn/npm/@scalar/galaxy/dist/latest.yaml,
        },
        pathRouting: {
          basePath: '/yaml',
        },
      },
      {
        spec: {
          url: 'https://cdn.jsdelivr.net.cn/npm/@scalar/galaxy/dist/latest.json',
        },
        pathRouting: {
          basePath: '/json',
        },
      },
    ],
  },
})

对于主题配置，您可以将 theme 属性传递给配置对象。默认主题是 nuxt，但您也可以传递 default 以使用默认主题。

export default defineNuxtConfig({
  modules: ['@scalar/nuxt'],
  scalar: {
    theme: 'nuxt',
  },
})

故障排除

如果您遇到任何 **** not default export 错误，则很可能是您正在使用 pnpm。一个临时的解决方法是启用 shamefully-hoist，直到我们解决导致包问题的原因。

要做到这一点，只需在您的项目根目录中创建一个 .npmrc 文件，并用以下内容填充它

shamefully-hoist=true