Integration with SvelteKit

SvelteKit is the fastest way to build svelte apps. It is very simple, and let you build frontend & backend in a single place.

You can add GraphQL Yoga with a few lines of code and get the benefits of GraphQL & SvelteKit at the same time. Envelop ecosystem for example!

Installation

In a SvelteKit project:

yarn add graphql-yoga graphql

Example

Create your graphql endpoint

Create the file src/routes/api/graphql.ts:

src/routes/api/graphql.ts

import { createYoga, createSchema } from 'graphql-yoga'
import type { RequestEvent } from '@sveltejs/kit'
 
const yogaApp = createYoga<RequestEvent>({
  schema: createSchema({
    typeDefs: `
			type Query {
				hello: String
			}
		`,
    resolvers: {
      Query: {
        hello: () => 'SvelteKit - GraphQL Yoga'
      }
    }
  }),
  // Needed to be defined explicitly because our endpoint lives at a different path other than `/graphql`
  graphqlEndpoint: '/api/graphql'
})
 
export { yogaApp as get, yogaApp as post }

Simple example on our GitHub repository here.

More examples with our KitQL library here.
The best of all GraphQL ecosystem for SvelteKit.

Last updated on November 15, 2022

Next.js Bun