I have asked the question based on the watchQuery undefined on stackoverflow. But I will ask again here.

Basically, I got an error says 'this.client.watchQuery is not a function' during SSR. My sample code looks like this

// AppServer.js
<ApolloProvider client={apolloClient}>
  <StaticRouter ...>
    <App />
  </StaticRouter ...>
</ApolloProvider>

// App.js
const App = () => {
    <Switch>
      <Route path="/" render={() => <Component />}>
    </Switch>
}

// Component.js
const Component = () => {
    <Switch>
      <Route path="/" render={() => <SubComponent />}>
    </Switch>
}

// SubComponent.js
const SubComponent = () => {
   <Query query={query}>
     {() => {...}}
   </Query>
}

I got an error says this.client.watchQuery is not a function from line 372 in react-apollo.cjs.js. However, if I move the Query component into a upper level component. In my case is component.js, then it will work and watchQuery is a function. I am wondering why moving between component can cause such weird behaviour. What I missed or What did I do wrong?

Please help. Thanks

Hey @zyl-edison-telus, I'm having a similar issue. Did you ever find a solution to your problem?