Scalar Next.js API Reference Handler

This plugin provides an easy way to render a beautiful API reference based on an OpenAPI/Swagger file with Next.js.

Installation

npm install @scalar/nextjs-api-reference

Usage

If you have a OpenAPI/Swagger file already, you can pass a URL to the plugin in an API Route:

// app/reference/route.ts
import { ApiReference } from '@scalar/nextjs-api-reference'

const config = {
  spec: {
    url: '/openapi.json',
  },
}

export const GET = ApiReference(config)

Or, if you just have a static OpenAPI spec, you can directly pass it as well:

const config = {
  spec: {
    content: '...',
  },
}

The Next.js handler takes our universal configuration object, read more about configuration in the core package README.

Themes

By default, we’re using a custom Next.js theme and it’s beautiful. But you can choose one of our other themes, too:

const config = {
  theme: 'purple',
}