Ask questionswatchQuery is not a function

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 ...>

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

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

// SubComponent.js
const SubComponent = () => {
   <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


Answer questions MattSidor

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

Github User Rank List