2

Apollo Client GraphQL: Actualizar Apollo Client a la version 2.x.x

En el curso se utiliza la version 1.x.x de Apollo Client, especificamente la 1.4.2, la cual ha sufrido cambios en su API, estando actualmente en la version 2.2.0.

Esto hace que el codigo del curso genere errores en algunas de sus dependencias a la hora de ejecutarlo, como el siguiente:

Failed to compile
./src/index.js
11:20-42'apollo-client' does not contain an export named 'createNetworkInterface'.

Para solucionar el problema hay que hacer lo siguiente:

  1. Actualizar las dependencias del proyecto.
yarn upgrade --latest

Esto actualizara todas las dependencias del proyecto a su ultima version.

  1. Agregar las siguientes dependencias al package.json
yarn add graphql apollo-link-http apollo-cache-inmemory
  1. Modificar el archivo index.js

Contenido original

import React from'react';
import ReactDOM from'react-dom';
import App from'./App';
import registerServiceWorker from'./registerServiceWorker';
import'./index.css';
import ApolloClient, { createNetworkInterface } from'apollo-client';
import { ApolloProvider } from'react-apollo'const client = new ApolloClient({
  networkInterface: createNetworkInterface({
    uri: '/api',
  }),
});


ReactDOM.render(
  <ApolloProviderclient={client}><App /></ApolloProvider>, document.getElementById('root'));
registerServiceWorker()

Reemplazar por este contenido

import React from'react'import ReactDOM from'react-dom'import'./index.css'import App from'./App'import registerServiceWorker from'./registerServiceWorker'import { ApolloClient } from'apollo-client'import { HttpLink } from'apollo-link-http'import { InMemoryCache } from'apollo-cache-inmemory'import { ApolloProvider } from'react-apollo'const client = new ApolloClient({
  link: new HttpLink({ uri: '/api' }),
  cache: new InMemoryCache()
})

ReactDOM.render(
<ApolloProviderclient={client}><App /></ApolloProvider>, document.getElementById('root'))
registerServiceWorker()

Eso es todo, con esto es suficiente para solucionar el error.

Espero que te haya servido el tutorial. Saludos 👋

Escribe tu comentario
+ 2