Установка динамического заголовка клиента Apollo не работает

Question

Я пытаюсь установить заголовок клиента Apollo динамически в соответствии с официальным do c, но я получаю сообщение об ошибке:

    TypeError: (0 , _apollo.default) is not a function

Это мой apollo. js

import { ApolloClient } from 'apollo-client';
import { createHttpLink } from 'apollo-link-http';
import { setContext } from 'apollo-link-context';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { AsyncStorage } from 'react-native';

const httpLink = createHttpLink({
    uri: 'http://192.168.2.4:8000/api/',
});

const authLink = setContext((_, { headers }) => {
    const token = AsyncStorage.getItem('token');

    return {
        headers: {
            ...headers,
            authorization: token ? `Bearer ${token}` : "",
        }
    }
});

const client = new ApolloClient({
    link: authLink.concat(httpLink),
    cache: new InMemoryCache()
});

export default client; 

ОБНОВЛЕНИЕ

Я добавляю Приложение. js:

import { ApolloProvider } from 'react-apollo';
import Routes from './app/config/routes';
import makeApolloClient from './app/config/apollo';

export default function App() {
  const client = makeApolloClient();

  return (
    <ApolloProvider client={client}>
      <Routes />
    </ApolloProvider>);
}

Как я могу решить эту проблему?

Answer 1

makeApolloClient не является функцией, файл просто экспортирует экземпляр клиента apollo. Просто импортируйте его как переменную.

import client from './app/config/apollo'

export default function App() {
    return (
        <ApolloProvider client={client}>
          <Routes />
        </ApolloProvider>
    );
}

Answer 2

Попробуйте это

const authLink = setContext(async (_, { headers }) => {
    const token = await AsyncStorage.getItem('token');

    return {
        headers: {
            ...headers,
            authorization: token ? `Bearer ${token}` : "",
        }
    }
});