Auto-generate OpenAPI 3.0 specs from your SvelteKit endpoints

SvelteKit OpenAPI
Generator

Document your APIs effortlessly with JSDoc annotations.
Live updates, TypeScript support, and zero configuration needed.

Powerful Features Out of the Box

Everything you need to create professional API documentation for your SvelteKit applications

Hot Module Replacement

Specs update live as you edit JSDoc comments. See changes instantly in dev mode.

Virtual Module

Import spec directly with import spec from "virtual:openapi-spec". No file I/O needed.

Smart Merging

Combines multiple specs intelligently using openapi-merge for unified documentation.

TypeScript Support

Full type support with automatic type stripping for .ts files. Type-safe by default.

SvelteKit Native

Handles route parameters, groups, and optional segments automatically from file structure.

Swagger UI Ready

Easy integration with Swagger UI for beautiful, interactive API documentation.

Quick Installation

Get started in minutes with bun, npm, yarn, or pnpm

bun add -d sveltekit-openapi-generator
1

Configure the Plugin

Add the plugin to your vite.config.js before the SvelteKit plugin

vite.config.js
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import openapiPlugin from 'sveltekit-openapi-generator';

export default defineConfig({
  plugins: [
    openapiPlugin({
      // OpenAPI info section
      info: {
        title: 'My API',
        version: '1.0.0',
        description: 'My API Description'
      },
      // OpenAPI servers configuration
      servers: [
        { url: 'https://api.example.com', description: 'Production' },
        { url: 'http://localhost:5173', description: 'Development' }
      ],
      // Path to shared schema definitions
      baseSchemasPath: 'src/lib/schemas.js',
      // Additional YAML files to include
      yamlFiles: ['src/lib/extra-specs.yaml'],
      // Path prefix for all routes
      prependPath: '/api',
      // Glob patterns to include
      include: ['src/routes/**/{+server,+page.server}.{js,ts}'],
      // Glob patterns to exclude
      exclude: ['**/node_modules/**', '**/.svelte-kit/**'],
      // Whether to fail on JSDoc parsing errors
      failOnErrors: false,
      // Output path for the spec file during build
      outputPath: 'static/openapi.json',
      // Debounce delay in milliseconds for file watching
      debounceMs: 200
    }),
    sveltekit()
  ]
});
2

Document Your Endpoints

Add @swagger JSDoc blocks to your server files

src/routes/api/users/+server.js
/**
 * @swagger
 * /api/users:
 *   get:
 *     summary: Get all users
 *     tags:
 *       - Users
 *     responses:
 *       200:
 *         description: Success
 *         content:
 *           application/json:
 *             schema:
 *               type: array
 *               items:
 *                 $ref: '#/components/schemas/User'
 */
export async function GET({ url }) {
  const users = await db.getUsers();
  return json({ users });
}
3

Define Shared Schemas (Optional)

Create reusable component schemas to avoid duplication

src/lib/schemas.js
/**
 * @swagger
 * components:
 *   schemas:
 *     User:
 *       type: object
 *       required:
 *         - id
 *         - email
 *       properties:
 *         id:
 *           type: string
 *           format: uuid
 *         email:
 *           type: string
 *           format: email
 *         name:
 *           type: string
 */

You're all set!

Your OpenAPI spec is now available at /openapi-spec.json during development. Import it with import spec from 'virtual:openapi-spec' in your components.

Configuration

Customize your API documentation details in vite.config.ts

vite.config.ts
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import openapiPlugin from 'sveltekit-openapi-generator';

export default defineConfig({
  plugins: [
    openapiPlugin({
      // OpenAPI info section
      info: {
        title: 'My API',
        version: '1.0.0',
        description: 'My API Description'
      },
      // OpenAPI servers configuration
      servers: [
        { url: 'https://api.example.com', description: 'Production' },
        { url: 'http://localhost:5173', description: 'Development' }
      ],
      // Path to shared schema definitions
      baseSchemasPath: 'src/lib/schemas.js',
      // Additional YAML files to include
      yamlFiles: ['src/lib/extra-specs.yaml'],
      // Path prefix for all routes
      prependPath: '/api',
      // Glob patterns to include
      include: ['src/routes/**/{+server,+page.server}.{js,ts}'],
      // Glob patterns to exclude
      exclude: ['**/node_modules/**', '**/.svelte-kit/**'],
      // Whether to fail on JSDoc parsing errors
      failOnErrors: false,
      // Output path for the spec file during build
      outputPath: 'static/openapi.json',
      // Debounce delay in milliseconds for file watching
      debounceMs: 200
    }),
    sveltekit()
  ]
});

Advanced Configuration

OptionTypeDescriptionDefault
infoOpenAPIV3.InfoObjectOpenAPI info section (title, version, description)-
serversOpenAPIV3.ServerObject[]OpenAPI servers configuration-
baseSchemasPathstringPath to file containing shared schema definitions-
yamlFilesstring[]Additional YAML files to include-
prependPathstringPath prefix to prepend to all routes (e.g., '/api')-
includestring[]Glob patterns to include['src/routes/**/{+server,+page.server}.{js,ts}']
excludestring[]Glob patterns to exclude['**/node_modules/**', '**/.svelte-kit/**']
failOnErrorsbooleanWhether to fail on JSDoc parsing errorsfalse
outputPathstringOutput path for the spec file during build-
debounceMsnumberDebounce delay in milliseconds for file watching200

See It In Action

This website itself is built with SvelteKit OpenAPI Generator. Explore the generated documentation and API endpoints.

Ready to Get Started?

Join developers who are already using SvelteKit OpenAPI Generator

Comments & Discussions

Have questions or feedback? Join the discussion on GitHub.