{"id":18118,"library":"apollo-client","title":"Apollo Client","description":"Apollo Client is a comprehensive GraphQL client for JavaScript applications, providing caching, state management, and integrations with React, Angular, Vue, and other frameworks. The current stable version is 4.1.9 (2025-01-14), with a legacy v2.6.10 still in use. Major versions have breaking changes: v3 introduced a new package structure (@apollo/client), removed the separate apollo-boost preset, and switched to a single combined package. v4 (alpha) introduces modern method signatures. Key differentiators: normalized in-memory cache, optimistic UI, pagination helpers, and developer tools. It requires a GraphQL schema and is compatible with any GraphQL server. Release cadence is rapid with frequent patches.","status":"active","version":"2.6.10","language":"javascript","source_language":"en","source_url":"https://github.com/apollographql/apollo-client","tags":["javascript","ecmascript","es2015","jsnext","relay","npm","react","typescript"],"install":[{"cmd":"npm install apollo-client","lang":"bash","label":"npm"},{"cmd":"yarn add apollo-client","lang":"bash","label":"yarn"},{"cmd":"pnpm add apollo-client","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency required for GraphQL operations.","package":"graphql","optional":false},{"reason":"The combined package replacing apollo-client v2; install this for v3+.","package":"@apollo/client","optional":false},{"reason":"Used to define GraphQL queries; often installed alongside.","package":"graphql-tag","optional":true}],"imports":[{"note":"In v2, import from 'apollo-client'. In v3+ (since 2020), use '@apollo/client'. Default import in v2; named import in v3+.","wrong":"import ApolloClient from 'apollo-client'","symbol":"ApolloClient","correct":"import { ApolloClient } from '@apollo/client'"},{"note":"gql is re-exported from @apollo/client in v3+. The graphql-tag package is still valid but the re-export is recommended for consistency.","wrong":"import gql from 'graphql-tag'","symbol":"gql","correct":"import { gql } from '@apollo/client'"},{"note":"In v3+, react hooks are part of @apollo/client. In v2, use 'react-apollo' (deprecated).","wrong":"import { useQuery } from 'react-apollo'","symbol":"useQuery","correct":"import { useQuery } from '@apollo/client'"},{"note":"In v2, separate package apollo-cache-inmemory. In v3+, integrated into @apollo/client.","wrong":"import InMemoryCache from 'apollo-cache-inmemory'","symbol":"InMemoryCache","correct":"import { InMemoryCache } from '@apollo/client'"},{"note":"In v2, separate package apollo-link-http. In v3+, integrated into @apollo/client.","wrong":"import HttpLink from 'apollo-link-http'","symbol":"HttpLink","correct":"import { HttpLink } from '@apollo/client'"}],"quickstart":{"code":"import { ApolloClient, InMemoryCache, gql } from '@apollo/client';\n\nconst client = new ApolloClient({\n  uri: process.env.GRAPHQL_ENDPOINT ?? 'https://api.example.com/graphql',\n  cache: new InMemoryCache()\n});\n\nclient.query({\n  query: gql`\n    query GetData {\n      users {\n        id\n        name\n      }\n    }\n  `\n}).then(result => console.log(result.data));","lang":"typescript","description":"Creates an Apollo Client instance with a GraphQL endpoint and in-memory cache, then executes a query."},"warnings":[{"fix":"Replace imports from 'apollo-client' etc. with '@apollo/client'. Update dependencies accordingly.","message":"v3 migrates from separate packages (apollo-client, apollo-cache-inmemory, apollo-link-http) to a single @apollo/client package.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Change `import ApolloClient from 'apollo-client'` to `import { ApolloClient } from '@apollo/client'`.","message":"In v3, ApolloClient is a named export, not default. v2 had default export.","severity":"breaking","affected_versions":">=3.0.0"},{"fix":"Use `import { useQuery } from '@apollo/client'` instead of `import { useQuery } from 'react-apollo'`.","message":"react-apollo package is deprecated; React hooks are now part of @apollo/client.","severity":"deprecated","affected_versions":">=3.0.0"},{"fix":"Upgrade to @apollo/client@4.1.5 or later, or manage polling manually with skip logic.","message":"`useQuery` will poll when `pollInterval` is set, even if `skip` is true. Fixed in v4.1.5+.","severity":"gotcha","affected_versions":">=3.0.0 <4.1.5"},{"fix":"Upgrade to @apollo/client@4.1.4+ or implement custom merge logic.","message":"PersistedQueryLink may overwrite http/fetchOptions context values instead of merging. Fixed in v4.1.4+.","severity":"gotcha","affected_versions":"<4.1.4"}],"env_vars":null,"last_verified":"2026-04-25T00:00:00.000Z","next_check":"2026-07-24T00:00:00.000Z","problems":[{"fix":"Wrap your app with <ApolloProvider client={client}> or pass client directly to useQuery.","cause":"Missing ApolloProvider wrapping the component tree or client prop not passed to useQuery.","error":"Error: Could not find \"client\" in the context or passed in as a prop."},{"fix":"Check network connectivity, ensure the GraphQL endpoint is correct, and handle loading/error states.","cause":"Query result is undefined due to network error or missing cache.","error":"TypeError: Cannot read property 'data' of undefined"},{"fix":"Provide a dataIdFromObject function in the cache constructor or use typePolicies for normalization.","cause":"Cache policy mismatch when using InMemoryCache with dataIdFromObject.","error":"Invariant Violation: You are using the simple (get) heuristic for caching."},{"fix":"Install @apollo/client and update imports to `import { ApolloClient } from '@apollo/client'`.","cause":"Trying to import apollo-client v2 package in a v3+ project.","error":"Could not find module 'apollo-client'"},{"fix":"Install @apollo/client instead and configure manually: `npm uninstall apollo-boost && npm install @apollo/client graphql`.","cause":"Using the deprecated preset package.","error":"Warning: You are using the deprecated `apollo-boost` package."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}