Window is not defined error in dev logs

apollographql / apollo-client-nextjs

Apollo Client support for the Next.js App Router

https://www.npmjs.com/package/@apollo/experimental-nextjs-app-support

MIT License

358 stars 25 forks source link

Window is not defined error in dev logs #261

Closed dml0031 closed 1 month ago

dml0031 commented 1 month ago

After recent updates with v0.9.0 and v0.9.1 the dev console logs are being flooded with this error:

As far as I can tell it isn't causing any actual issues in the application, everything builds and functions as intended. My Dev console logs are just flooded with this over and over. Can provide any extra information that may be necessary.

jerelmiller commented 1 month ago

The 0.9 release of the next package changed exports to use export conditions. It seems from your screenshot that the browser bundle is getting pulled in for some reason on your server when it should be pulling either the node or react-server bundle. The browser bundle contains references to window which would explain your error.

Unfortunately I don't know a ton beyond that as I'm fairly unfamiliar with export conditions myself, but perhaps this is something to go on? The maintainer that knows more about this stuff should be back in the next few days so I'll see if I can get some help here when he is back.

dml0031 commented 1 month ago

Well the providers/clients are re-used across a lot of apps in a monorepo setup. These are the only 2 imports from this package to create the re-usable clients.

Client Provider:

Server Provider:

And they are both exported from the same package. Figured the "use client" and "use server" directives would be enough to make sure everything gets run where its supposed to but maybe not. Not sure if this helps give any more insight.

dml0031 commented 1 month ago

The 0.9 release of the next package changed exports to use export conditions. It seems from your screenshot that the browser bundle is getting pulled in for some reason on your server when it should be pulling either the node or react-server bundle. The browser bundle contains references to window which would explain your error.

Unfortunately I don't know a ton beyond that as I'm fairly unfamiliar with export conditions myself, but perhaps this is something to go on? The maintainer that knows more about this stuff should be back in the next few days so I'll see if I can get some help here when he is back.

Okay so after looking into it some more, the error only appears on a page with export const runtime = 'edge' after removing that, the error is gone. Is there something else I should be using for the edge runtime ?

jerelmiller commented 1 month ago

That's helpful! I found this discussion related to edge runtime and the browser export. Perhaps we need to add a worker exports key as mentioned by this comment? I'll connect with Lenz when he's back and see what the best course of action would be.

phryneas commented 1 month ago

I believe this will be solved by https://github.com/apollographql/apollo-client-nextjs/pull/263

Could you please give

npm i @apollo/experimental-nextjs-app-support@0.0.0-commit-84f7c8d

a try?

dml0031 commented 1 month ago

I believe this will be solved by #263

Could you please give
npm i @apollo/experimental-nextjs-app-support@0.0.0-commit-84f7c8d
a try?

It does appear the issue is gone with that version!

github-actions[bot] commented 1 month ago

Do you have any feedback for the maintainers? Please tell us by taking a one-minute survey. Your responses will help us understand Apollo Client usage and allow us to serve you better.

phryneas commented 1 month ago

This has been released as 0.9.2.