SvelteKit Adapter Overview

The @capyseo/adapter-sveltekit package provides deep integration with SvelteKit for real-time SEO analysis.

Installation

npm install -D @capyseo/adapter-sveltekit
# or
bun add -D @capyseo/adapter-sveltekit

Integration Methods

Method	Description	Use Case
Vite Plugin	Build-time analysis	CI/CD, dev feedback
Server Hooks	Runtime analysis	Production monitoring

Quick Start

Option 1: Vite Plugin

Add to vite.config.ts:

import { sveltekit } from '@sveltejs/kit/vite';
import { capyseo } from '@capyseo/adapter-sveltekit/vite';

export default {
  plugins: [
    sveltekit(),
    capyseo({
      enabled: true,
      minScore: 75,
      failOnError: true,
    }),
  ],
};

Option 2: Server Hooks

Add to src/hooks.server.ts:

import { createCapyseoHandle } from '@capyseo/adapter-sveltekit/hooks';

export const handle = createCapyseoHandle({
  enabled: process.env.NODE_ENV === 'development',
  logLevel: 'issues',
});

Option 3: Both

Use both for maximum coverage:

Plugin: Build-time enforcement
Hooks: Runtime monitoring

Features

Vite Plugin

Dev server middleware
Build-time validation
Minimum score enforcement
Non-blocking analysis

Server Hooks

Request/response interception
Custom report handlers
Runtime analysis
Production monitoring

Configuration

Both integrations accept:

Option	Type	Default	Description
`enabled`	boolean	true in dev	Enable analysis
`geminiApiKey`	string	env var	AI API key
`exclude`	string[]	-	Paths to skip

Output Example

[capyseo] /about - Score: 85/100
  x [meta-description] Missing meta description
    Add <meta name="description" content="...">
  ! [heading-hierarchy] Skipped heading level
    Use sequential heading levels

Peer Dependencies

@sveltejs/kit ^2.0.0
svelte ^4.0.0 || ^5.0.0
vite ^5.0.0 || ^6.0.0