React Hook "useApolloServerErrors" cannot be called at the top level.

[tettoffensive]

I'm attempting to migrate from Apollo Server (with Next.js), but I'm getting the following error with useApolloServerErrors:

React Hook "useApolloServerErrors" cannot be called at the top level. React Hooks must be called in a React function component or a custom React Hook function.

import { createServer } from '@graphql-yoga/node';
import { useApolloServerErrors } from '@envelop/apollo-server-errors';

const server = createServer<{
  req: NextApiRequest;
  res: NextApiResponse;
}>({
  schema,
  cors: false,
  endpoint: '/api/graphql',
  plugins: [
    useApolloServerErrors(),
  ],
});

This looks like what's in the docs, so what could be going wrong?

[n1ru4l]

This is caused by an eslint rule https://www.npmjs.com/package/eslint-plugin-react-hooks

You should only enable that for your files that actually use React and disable it for your API routes, e.g. by adding /* eslint-disable react-hooks/rules-of-hooks */ on top of the file.