vuejs/vue-apollo
Vue Apollo
Vue Apollo is a GraphQL client library for Vue.js that integrates Apollo GraphQL queries and mutations into Vue components with reactive data binding. It provides a reactive data layer that automatically updates Vue component state when GraphQL query results change, and supports server-side rendering by prefetching queries during SSR to deliver fully populated HTML on initial page load.
The library allows GraphQL queries and mutations to be declared directly inside Vue component options using the apollo property, keeping data dependencies co-located with the UI. It wraps Apollo Client's normalized cache with Vue's reactivity system so query results automatically trigger component re-renders when cache data changes. Mutation responses update the normalized cache and trigger reactive updates to all dependent queries without manual refetching.
Vue Apollo exposes loading, error, and success states through named Vue slots for declarative rendering of each GraphQL query lifecycle phase. It automatically manages subscription lifecycles, subscribing to GraphQL subscriptions for active queries and unsubscribing when components unmount to prevent stale data and memory leaks. The library also executes GraphQL queries during server-side rendering and injects the resulting data into the initial HTML payload before client hydration.