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
388 stars 28 forks source link

registerApolloClient is not a function when using RSC's with Storybook #307

Open shawngustaw opened 3 weeks ago

shawngustaw commented 3 weeks ago

I'm trying to upgrade from v0.5.* to latest, and noticed when I upgrade this package my storybook starts to have issues bundling things correctly. Anyone have any ideas how to fix this? The docs on using RSC's with storybook are here: https://storybook.js.org/blog/storybook-react-server-components/

phryneas commented 3 weeks ago

We are following the server module convention of "react-server" conditional exports for code that is meant to run in RSC. (See https://github.com/reactjs/rfcs/blob/main/text/0227-server-module-conventions.md#react-server-conditional-exports )

That means that registerApolloClient is available only in certain environments, to prevent you from accidentally using it in Client Components, which would be a bug.

Unfortunately, if you are experiencing this with StoryBook, it seems that they are not adhering to those conventions - they would need to set the "react-server" condition when trying to import your code for RSC. I believe you'd have to bring that up with Storybook, I'm sorry :/

phryneas commented 3 weeks ago

PS: I believe you should be able to manually set that as shown in

https://webpack.js.org/configuration/resolve/#resolveconditionnames

but that would probably set it for all your components and as a result break your Client Components.

It might be worth a try though - but in the end, this can only be solved on the StoryBook side.

shawngustaw commented 3 weeks ago

Thanks for the quick response! and yeah, that makes sense. Seems like the storybook implementation of RSC's is fully client side (https://github.com/storybookjs/storybook/pull/25091) so this might be an issue for everyone trying to use this lib with storybook. Will raise the issue with them and see if theres a path forward. Thanks again!

phryneas commented 3 weeks ago

Thank you! Following the discussion over there :)