Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

next.js 15 build error #3454

Open
rfw opened this issue Nov 1, 2024 · 3 comments
Open

next.js 15 build error #3454

rfw opened this issue Nov 1, 2024 · 3 comments

Comments

@rfw
Copy link

rfw commented Nov 1, 2024

Describe the bug

// Next.js Custom Route Handler: https://nextjs.org/docs/app/building-your-application/routing/router-handlers
import { createSchema, createYoga } from 'graphql-yoga'
import type { NextApiRequest, NextApiResponse } from 'next'

const { handleRequest } = createYoga({
  schema: createSchema<{
    req: NextApiRequest
    res: NextApiResponse
  }>({
    typeDefs: /* GraphQL */ `
      type Query {
        greetings: String
      }
    `,
    resolvers: {
      Query: {
        greetings: () => 'This is the `greetings` field of the root `Query` type'
      }
    }
  }),

  // While using Next.js file convention for routing, we need to configure Yoga to use the correct endpoint
  graphqlEndpoint: '/api/graphql',

  // Yoga needs to know how to create a valid Next response
  fetchAPI: {
    Response: Response,
    Request: Request,
  },
})

export { handleRequest as GET, handleRequest as POST, handleRequest as OPTIONS }

Error log

yarn build
yarn run v1.22.22
$ next build
   ▲ Next.js 15.0.2
   - Environments: .env.local, .env

   Creating an optimized production build ...
 ✓ Compiled successfully
   Linting and checking validity of types  .Failed to compile.

.next/types/app/api/graphql/route.ts:49:7
Type error: Type '{ __tag__: "GET"; __param_position__: "second"; __param_type__: Partial<ServerAdapterInitialContext>; }'
 does not satisfy the constraint 'ParamCheck<RouteContext>'.
  Types of property '__param_type__' are incompatible.
    Property 'params' is missing in type 'Partial<ServerAdapterInitialContext>' but required in type 'RouteContext'.

  47 |     Diff<
  48 |       ParamCheck<RouteContext>,
> 49 |       {
     |       ^
  50 |         __tag__: 'GET'
  51 |         __param_position__: 'second'
  52 |         __param_type__: SecondArg<MaybeField<TEntry, 'GET'>>
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

Your Example Website or App

not

Steps to Reproduce the Bug or Issue

nextjs 15

https://the-guild.dev/graphql/yoga-server/docs/integrations/integration-with-nextjs

Expected behavior

No error

Screenshots or Videos

image

Platform

  • OS: Windows
  • NodeJS: 21.7.3
  • @graphql-yoga/* version(s):5.8.0

Additional context

No response

@nick-cheatwood7
Copy link

This worked for me:

import { createSchema, createYoga } from 'graphql-yoga';
 
const { handleRequest } = createYoga({
  schema: createSchema({
    typeDefs: /* GraphQL */ `
      type Query {
        greetings: String
      }
    `,
    resolvers: {
      Query: {
        greetings: () => 'This is the `greetings` field of the root `Query` type'
      }
    }
  }),
  graphqlEndpoint: '/api/graphql',
  fetchAPI: { Response }
});

// 👇 Manually set the `ctx` param (the second parameter in `handleRequest`)
export const GET = (req: Request) => handleRequest(req, {});
export const POST = (req: Request) => handleRequest(req, {});
export const OPTIONS = (req: Request) => handleRequest(req, {});

// 👇 this syntax produces a build error during `next build` (as of Next.js 15.0.2)
// export { handleRequest as GET, handleRequest as POST, handleRequest as OPTIONS }

Gotta love Next.js sometimes...

@n1ru4l
Copy link
Collaborator

n1ru4l commented Nov 11, 2024

@nick-cheatwood7 Could you help us updating the documentation for this?

@nick-cheatwood7
Copy link

@n1ru4l Yes, I'd be happy to. I don't have prior experience with contributing to this documentation, though. Is there a guide on how to do so or anything?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants