Enable batching for apollo nuxt

Question

I have read many articles showing how to accomplish this but I am still not seeing my GQL requests being batched. Here is my code which works in the sense that it gets my data but I am getting a page load time of ~4sec. My queries are local to my components so I can reuse them else where in my app. Also the QGL server is CraftCMS.

Here is my custom apollo config:

import { InMemoryCache, IntrospectionFragmentMatcher } from 'apollo-cache-inmemory';
import { BatchHttpLink } from "apollo-link-batch-http";
import schema from './schema.json';
import { errorHandler } from '../errorHandler'
import { ApolloLink } from 'apollo-link';

const fragmentMatcher = new IntrospectionFragmentMatcher({
    introspectionQueryResultData: schema
})

export default ({ req, app, $config }) => {
    const token = $config.graphqlToken;
    const uri = $config.apiBaseUrl + $config.graphqlPath

    const cache = new InMemoryCache({ fragmentMatcher });
    const batchHttpLink = new BatchHttpLink({ uri });
    
    return {
        link: ApolloLink.from([errorHandler, batchHttpLink]),
        getAuth: () => `Bearer ${token}`,
        cache,
        defaultHttpLink: false,
    };
}