Apollo-client: TypeError: Cannot set property 'defaultOptions' of undefined

Created on 7 Jan 2019  路  3Comments  路  Source: apollographql/apollo-client

Intended outcome:

Was attempting a basic client set up after creating a prisma server. Appears below:

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import { ApolloProvider } from "react-apollo";
import ApolloClient from "apollo-client";
import { HttpLink } from "apollo-link-http";
import { InMemoryCache } from "apollo-cache-inmemory";
import { BrowserRouter } from "react-router-dom";

const client = ApolloClient({
  link: new HttpLink({ uri: "http://localhost:4000" }),
  cache: new InMemoryCache()
});

ReactDOM.render(
  <ApolloProvider client={client}>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </ApolloProvider>,
  document.getElementById("root")
);

Set up of basic client continues to return TypeError: Cannot set property 'defaultOptions'. I've tried hard setting with code as follows.

screen shot 2019-01-06 at 9 18 34 pm

const defaultOptions = {
  watchQuery: {
    fetchPolicy: 'cache-and-network',
    errorPolicy: 'ignore',
  },
  query: {
    fetchPolicy: 'network-only',
    errorPolicy: 'all',
  },
  mutate: {
    errorPolicy: 'all'
  }
}

const client = ApolloClient({
  link: new HttpLink({ uri: "http://localhost:4000" }),
  cache: new InMemoryCache(),
  defaultOptions
});

How to reproduce the issue:

I'm using current react-create-app, npm, and prisma as a server which shouldn't really be impacting anything. My guess is some odd interaction with the webpack of new create-react-app but I believe thats a shot in the dark. Maybe the docs are not very clear on defaultOptions.

Versions

System:
OS: macOS 10.14
Binaries:
Node: 8.9.1 - ~/.nvm/versions/node/v8.9.1/bin/node
Yarn: 1.3.2 - /usr/local/bin/yarn
npm: 6.4.1 - ~/.nvm/versions/node/v8.9.1/bin/npm
Browsers:
Chrome: 71.0.3578.98
Firefox: 57.0.4
Safari: 12.0
npmPackages:
apollo-boost: ^0.1.23 => 0.1.23
apollo-cache-inmemory: ^1.3.12 => 1.3.12
apollo-client: ^2.4.8 => 2.4.8
apollo-link-http: ^1.5.9 => 1.5.9
react-apollo: ^2.3.3 => 2.3.3

Most helpful comment

Also make sure you don't forget the new keyword when creating the apollo-client:

const client = new ApolloClient({ //...

All 3 comments

It is import { ApolloClient } from "apollo-client"; or import ApolloClient from "apollo-boost". At this moment you are mixing both of them resulting in unwanted behavior.

Also make sure you don't forget the new keyword when creating the apollo-client:

const client = new ApolloClient({ //...

Closing since not a bug.

Was this page helpful?
0 / 5 - 0 ratings