Nitro GraphQL
click to drop food
1

Installation

Install Nitro GraphQL with your package manager

1 min readEdit on GitHub

Installation

Requirements

  • Node.js 24+ (or Bun)
  • pnpm, npm, yarn or bun
Warning

Nitro GraphQL requires Nitro v3 and H3 v2. These versions require Node.js 24+.

Create a project from ready-made templates with CLI:

pnpm dlx nitro-graphql init my-app -t nitro
cd my-app
pnpm install
pnpm dev
npx nitro-graphql init my-app -t nitro
cd my-app
npm install
npm run dev
bunx nitro-graphql init my-app -t nitro
cd my-app
bun install
bun dev
Info

Other templates: vite, vite-react, vite-vue, drizzle-orm, better-auth

To see all templates: npx nitro-graphql init --list

GraphQL Playground: http://localhost:3000/api/graphql


Manual Installation

To add to an existing project:

1. Install Packages

pnpm add nitro-graphql graphql graphql-yoga rolldown
npm install nitro-graphql graphql graphql-yoga rolldown
yarn add nitro-graphql graphql graphql-yoga rolldown
bun add nitro-graphql graphql graphql-yoga rolldown

2. Configuration

Nitro

Add to your nitro.config.ts:

TypeScript
import { defineConfig } from 'nitro'
import graphql from 'nitro-graphql'

export default defineConfig({
  modules: [
    graphql({
      framework: 'graphql-yoga',
    })
  ]
})

Vite + Nitro

Add to your vite.config.ts:

TypeScript
import graphql from 'nitro-graphql'
import { nitro } from 'nitro/vite'
import { defineConfig } from 'vite'

export default defineConfig({
  plugins: [
    graphql({
      framework: 'graphql-yoga',
    }),
    nitro(),
  ],
})

Nuxt

Nuxt SupportComing Soon

Nuxt is not currently supported. Support will be added with Nuxt 5.

3. Create GraphQL Files

text
my-project/
├── server/
│   └── graphql/
│       ├── config.ts         # GraphQL configuration
│       ├── schema.graphql    # Schema definitions
│       └── hello.resolver.ts # Resolvers
├── nitro.config.ts
└── package.json

server/graphql/config.ts:

TypeScript
import { defineGraphQLConfig } from 'nitro-graphql/define'

export default defineGraphQLConfig({})

server/graphql/schema.graphql:

GraphQL
type Query {
  hello: String!
}

server/graphql/hello.resolver.ts:

TypeScript
import { defineQuery } from 'nitro-graphql/define'

export const helloQueries = defineQuery({
  hello: () => 'Hello from Nitro GraphQL!',
})

4. Start Dev Server

pnpm dev
npm run dev
yarn dev
bun dev

GraphQL Playground: http://localhost:3000/api/graphql

Success

If you see the GraphiQL interface, installation is complete!

Comments

Use ← → arrow keys to navigate