apollographql / apollographql/apollo-client-integrations

Unhandled Runtime Error getClient)(...).query is not a function when upgrading from Next.js 14.1.0 to 14.1.1

Open
#336 5 comments 1 reaction 0 assignees View on GitHub
Dominant language
TypeScript
Stars
556
Forks
53
PR merge metrics
No merged PRs in 30d

Description

I'm migrating a Next.js app from the pages to the app router. I'm currently using:

"@apollo/client": "3.11.1"
"@apollo/experimental-nextjs-app-support": "0.11.2"
"next": "14.1.1"

I've followed the recommendations in the README and am using the following code to set up the Apollo Client:

```import { HttpLink } from "@apollo/client";
import {
registerApolloClient,
ApolloClient,
InMemoryCache,
} from "@apollo/experimental-nextjs-app-support";

export const { getClient, query, PreloadQuery } = registerApolloClient(() => {
return new ApolloClient({
cache: new InMemoryCache(),
link: new HttpLink({
// this needs to be an absolute url, as relative urls cannot be used in SSR
uri: "http://example.com/api/graphql",
}),
});
});
```

I call the client like this:
`const { data } = await getClient().query({ query: getUserQuery });`

With Next.js 14.1.0, this works fine. If I upgrade to Next.js 14.1.1, I get the following error:

```
✓ Compiled /dashboard in 5.7s (3021 modules)
⨯ app/dashboard/page.tsx (25:37) @ query
⨯ TypeError: (0 , _apollo_ApolloRSC__WEBPACK_IMPORTED_MODULE_1__.getClient)(...).query is not a function
at DashboardHome (./app/dashboard/page.tsx:42:91)
at stringify ()
23 | // } = useUser();
24 |
> 25 | const { data } = await getClient().query({ query: getUserQuery });
| ^
26 | const user = data.viewer;
27 |
28 | if (!user) {
```

Contributor guide

No contributing guide indexed for this repository

Research direction

Start by reproducing the failure in app/dashboard/page.tsx with Next.js 14.1.0 and 14.1.1, using the versions and registerApolloClient setup from the report. Read the integration README and trace getClient() to determine why its result no longer exposes query; done means the reported query call works on Next.js 14.1.1 without the runtime error.

Written by the indexing model from the issue text.

Assessment

Tech stack
next.js, typescript
Domain
backend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
30/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.