createNetworkInterface is not a function

The docs say that you can create a new Network Interface by using

import ApolloClient, { createNetworkInterface } from 'apollo-client';

const networkInterface = createNetworkInterface('http://localhost:8080/graphql');

const client = new ApolloClient({
  networkInterface
});

but for me it throws

Uncaught TypeError: (0 , _apolloClient.createNetworkInterface) is not a function

Is there anything that I’m missing?

(I’m using apollo-client with Electron and a normal Graphql Server.)

[amackintosh]

I just opened a project and updated react-apollo and it detonated everything, which is also highlighting that https://github.com/apollographql/react-apollo is currently some troll documentation.

I was using these like this in React Native:

import { ApolloClient, createNetworkInterface, ApolloProvider } from 'react-apollo'

It definitely doesn’t work in React Web with react-apollo 2.0.

I checked my RN app and even though I installed it last week~, its using react-apollo 1.4.

I will downgrade back to sub 2.0, and post my results since someone else will surely see this as well.

Thanks to the magic of time travel, here are my results:

$ npm install --save react-apollo@^1.4

There is no 1.5, 1.6, 1.7, 1.8, or 1.9, so that will downgrade you to the newest non-2.0 version, and you can use:

import { ApolloClient, createNetworkInterface, ApolloProvider } from 'react-apollo'

You don’t need to install apollo-client.

Just kidding, apollo-client is included with react-apollo. You should see it in node_modules if you burn everything to the ground and just install react-apollo 1.4~.

Here is some bonus code, just in case anyone wants to confirm what works well:

./src/index.js

import { ApolloClient, createNetworkInterface, ApolloProvider } from 'react-apollo'

const tokenOnLoad = localStorage.getItem('token')
if (tokenOnLoad) store.dispatch({ type: LOGIN_SUCCESS })

const networkInterface = createNetworkInterface({
  uri: 'http://localhost:7000/graphql',
  opts: {
    credentials: 'same-origin',
    mode: 'cors'
  }
})

networkInterface.use([{
  applyMiddleware(req, next) {
    if (!req.options.headers) req.options.headers = {}
    const token = localStorage.getItem('token')
    req.options.headers.authorization = token || null
    next()
  }
}])

export const client = new ApolloClient({
  networkInterface,
  dataIdFromObject: (o) => o.id
})

const Root = () => (
  <ApolloProvider store={store} client={client}>
    <Router history={history}>
      <Route path="/" component={App} />
    </Router>
  </ApolloProvider>
)

ReactDOM.render(
  <Root />,
  document.querySelector('#root')
)

I imagine you will want to avoid anything to do with this code if you are looking to get to react-apollo 2.0.

I checked it out and the setup looked haywire breaking change, so I won’t be switching to it ASAP unless someone posts a migration path and usage of graphql() and withApollo() are virtually identical.

[Karsens]

same 🔢