Invariant Violation APOLLO: Using next.js and ts

Invariant Violation APOLLO: Using next.js and ts


0

I get an Invariant Violation when using the apollo client on react, specifically when I use the ApolloProvider. If I delete those ApolloProvider lines the problem goes, also I already tried removing the provider from Next-Auth. I’m using typescript and I don’t know if the declaration of the apollo configuration is correct.

This is the error:
⨯ node_modulests-invariantlibinvariant.cjs (16:27) @ call ⨯ Invariant Violation: An error occurred! For more details, see the full error text at https://go.apollo.dev/c/err#%7B%22version%22%3A%223.8.4%22%2C%22message%22%3A43%2C%22args%22%3A%5B%5D%7D at stringify (<anonymous>) null

import './globals.css'
import type { Metadata } from 'next'
import { Inter } from 'next/font/google'
import AuthProviders from "../Providers/Providers";

//graphQL
import {
  ApolloClient,
  InMemoryCache,
  ApolloProvider,
  HttpLink,
  from,
} from "@apollo/client";
import { onError, ErrorResponse } from "@apollo/client/link/error";

const inter = Inter({ subsets: ['latin'] })

export const metadata: Metadata = {
  title: 'test',
  description: 'Generated by create next app',
}

// const errorLink = onError((errorResponse: ErrorResponse) => {
//   if (errorResponse.graphqlErrors) {
//     errorResponse.graphqlErrors.map(({ message  }) => {
//       alert(`GraphQL error ${message}`);
//     });
//   }
// });

const link = from([
  // errorLink,
  new HttpLink({ uri: "https://localhost:4000" }),
]);

const client = new ApolloClient({
  cache: new InMemoryCache(),
  link: link,
});


export default function RootLayout({
  children,
}: {
  children: React.ReactNode
}) {
  return (
    <html lang="en">
      <body className={inter.className}>
        <ApolloProvider client={client}>
          <AuthProviders>
            {/* {children} */}
          </AuthProviders>
        </ApolloProvider>
      </body>
    </html>
  )
}


Load 5 more related questions


Show fewer related questions

0



Leave a Reply

Your email address will not be published. Required fields are marked *