Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
muslnode 18–226 runs
build_error
glibcnode 18–226 runs
build_error
Code
Verified usage
Verified import paths — ran on the pinned version, not inferred.
addEndpointDirectiveForCodegen
✓ import { addEndpointDirectiveForCodegen } from 'apollo-client-mux/transform';
✗ import { addEndpointDirectiveForCodegen } from 'apollo-client-mux';
This utility is imported from a specific subpath, not the main package entry.
withCacheMux
✓ import { withCacheMux } from 'apollo-client-mux';
✗ import ApolloCacheMux from 'apollo-client-mux';
withCacheMux is a named export function used to create a muxed cache class, not a direct class export.
createApolloLinkMux
✓ import { createApolloLinkMux } from 'apollo-client-mux';
✗ import ApolloLinkMux from 'apollo-client-mux';
createApolloLinkMux is a named export function that constructs the multiplexing ApolloLink.
Demonstrates configuring graphql-codegen to add an `@endpoint` directive and then setting up an Apollo Client instance with a multiplexed cache and link for multiple GraphQL endpoints.
import { ApolloClient, HttpLink, InMemoryCache } from '@apollo/client';
import { ApolloCacheMux, withCacheMux, createApolloLinkMux } from 'apollo-client-mux';
import type { CodegenConfig } from '@graphql-codegen/cli';
import { addEndpointDirectiveForCodegen } from 'apollo-client-mux/transform';
// --- GraphQL Codegen Configuration (for your endpoint) ---
// This config snippet assumes you have graphql-codegen setup
// and want to route operations for 'yourEndpoint' through the mux.
const codegenConfig: CodegenConfig = {
schema: 'http://localhost:4000/graphql', // Your endpoint's schema
generates: {
'src/gql/yourEndpoint/': {
preset: 'client',
documentTransforms: [
{
transform: addEndpointDirectiveForCodegen({
endpointName: 'yourEndpoint' // Must match the name used in client setup
})
}
]
}
}
};
// --- Apollo Client Mux Setup ---
// 1. Create muxed cache
const InMemoryCacheMux = withCacheMux(InMemoryCache);
const yourEndpointCache = new InMemoryCache();
const defaultCache = new InMemoryCache();
const cache = new InMemoryCacheMux({
mux: {
caches: {
yourEndpoint: yourEndpointCache // Cache specifically for 'yourEndpoint'
}
},
// Options for the default cache (used when no @endpoint directive is present)
...defaultCache.extract()
});
// 2. Create muxed link
const yourEndpointHttpLink = new HttpLink({ uri: 'http://localhost:4001/graphql' });
const defaultHttpLink = new HttpLink({ uri: 'http://localhost:4000/graphql' });
const link = createApolloLinkMux({
links: {
yourEndpoint: yourEndpointHttpLink // Link specifically for 'yourEndpoint'
},
defaultLink: defaultHttpLink // Link for operations without @endpoint
});
// 3. Create Apollo Client instance with muxed cache and link
const client = new ApolloClient({
cache,
link
});
console.log('Apollo Client with Muxed Endpoints initialized:', client);
// Example: Execute a query (assuming your codegen generated this)
// client.query({ query: YourEndpointQueryDocument });
Errors
Common errors & fixes
TypeError: (0 , _apollo_client_mux_transform__WEBPACK_IMPORTED_MODULE_2__.addEndpointDirectiveForCodegen) is not a function
Incorrect import path or CommonJS `require()` syntax used in an ESM context for `addEndpointDirectiveForCodegen`.
fixEnsure you are using `import { addEndpointDirectiveForCodegen } from 'apollo-client-mux/transform';` and that your module resolution is configured for ESM. Error: Apollo Client Mux: Endpoint 'yourEndpointName' not found in muxed links/caches.
The endpoint name specified in an operation's `@endpoint` directive (or implicitly via codegen) does not have a corresponding entry in the `links` or `caches` object passed to `createApolloLinkMux` or `withCacheMux`.
fixDouble-check that the `endpointName` option in `addEndpointDirectiveForCodegen` matches the keys provided in the `links` and `caches` configuration for the multiplexers.
Invariant Violation: 'cache' must be an instance of ApolloCache or a function that returns one.
Often occurs if `withCacheMux` is not correctly used to instantiate the cache, or if an incorrect `ApolloCache` instance is passed to the `ApolloClient`.
fixEnsure `withCacheMux(InMemoryCache)` is called and then `new InMemoryCacheMux(...)` is used to create the actual cache instance. Verify that the resulting object is what's passed to `ApolloClient`'s `cache` option.
Audit
Dependencies
@apollo/clientrequiredCore dependency for Apollo Client functionality.
graphqlrequiredRequired for GraphQL AST manipulation and client operations.