@openapi-ui/hono-openapi-ui

Hono-OpenAPI-UI Middleware

Install

npm install @openapi-ui/hono-openapi-ui

pnpm install @openapi-ui/hono-openapi-ui

Usage

Set up Zod OpenAPI Hono and pass an OpenAPI/Swagger spec to the openApiUIReference middleware:

import { openApiUIReference } from '@openapi-ui/hono-openapi-ui';

app.doc('/openapi.json', {
  info: {
    title: 'Example API',
    description: 'Example API description',
    version: '1.0.0',
  },
  openapi: '3.0.0',
});

app.use(
  '/openapi',
  openApiUIReference({
    specPath: '/openapi.json',
  }),
);

try example

Themes

import { openApiUIReference } from '@openapi-ui/hono-openapi-ui';

app.use(
  '/openapi',
  openApiUIReference({
    specPath: '/openapi.json',
    theme: 'light', // light or dark
  }),
);

Custom CDN

You can use a custom CDN ，default is https://unpkg.com/openapi-ui-dist.

import { openApiUIReference } from '@openapi-ui/hono-openapi-ui';

app.use(
  '/openapi',
  openApiUIReference({
    specPath: "/openapi.json",
    cdn: 'https://registry.npmmirror.com/openapi-ui-dist/latest/files',
  }),
);