-
Notifications
You must be signed in to change notification settings - Fork 26.9k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Using Apollo GraphQL on _app.js #10046
Comments
Are you using the hooks? I believe all queries will be SSR unless you specify ssr:false. |
You can't do it directly in <ApolloProvider client={apolloClient}>
<YourHeader /> // <- the component that will query the server
<Component {...pageProps} />
</ApolloProvider> The current example only works for pages because it is a better default since we can have SSR pages and auto static optimization, but you can see older versions where the provider was in That said, since using the |
That is only true if you need static page optimization, which is just usable in simple applications. If you need for example to have apollo data within your ApplicationLayout, wrapping each and every page is not a good solution. I get the feeling this static page optimization thing gets too much attention, while it is not useful for everyone using nextjs and its not a good idea, to make life for devs harder just to enforce a certain feature. /rantoff @andrenaught the official example does not work anymore with an ApolloProvider in _app, you will lose SSR capabilities. I try to figure out how to solve that with the latest nextjs |
@macrozone The solution I mentioned does not consider auto static optimization, it will apply the header on all pages and disable the auto static optimization (I mentioned it at the end of the message). I also sent a link with the latest working version of the apollo example with |
@rafaelalmeidatk i could successfuly use your example with next 9.2.0, thank you! |
While not suggested, you can wrap your custom app with |
The current example doesn't support this tho: https://github.com/zeit/next.js/blob/canary/examples/with-apollo/lib/apollo.js#L35 |
@rafaelalmeidatk oh! I swore we added support for this. Re-opened relevant PR: #8801 |
Any chance for update typescript version of |
Why is this not suggested? |
This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you. |
Feature request
Do server side rendering with GraphQL data to be displayed on all pages (using _app.js).
Sometimes there's data that I want to server side render throughout the entire app - _app.js (ex: dynamic content in the header). It seems the with-apollo example only works on pages. I'm assuming a certain Apollo config can make this happen? Can this be implemented in the
with-apollo
example?The text was updated successfully, but these errors were encountered: