Vue Apollo multiple endpoint setup

MainApollo.js

import Vue from 'vue'
import VueApollo from 'vue-apollo'
import { InMemoryCache } from 'apollo-cache-inmemory'
import { ApolloClient } from 'apollo-client'

const cache = new InMemoryCache()

// Install the vue plugin
Vue.use(VueApollo)

const defaultOptions = {
  // You can use `wss` for secure connection (recommended in production)
  // Use `null` to disable subscriptions
  wsEndpoint: null,
  // LocalStorage token
  tokenName: 'AUTH_TOKEN',
  // Enable Automatic Query persisting with Apollo Engine
  persisting: false,
  // Use websockets for everything (no HTTP)
  // You need to pass a `wsEndpoint` for this to work
  websocketsOnly: false,
  // Is being rendered on the server?
  ssr: true,

  cache
}

// Call this in the Vue app file
export function apolloCreateProvider () {

  const adminOptions = { link: process.env.VUE_APP_API_ADMIN_GRAPHQL }
  const siteOptions = { link: process.env.VUE_APP_API_SITE_GRAPHQL }
  const userOptions = { link: process.env.VUE_APP_API_USER_GRAPHQL }

  const admin = new ApolloClient({ ...defaultOptions, ...adminOptions});
  const site = new ApolloClient({ ...defaultOptions, ...siteOptions});
  const user = new ApolloClient({ ...defaultOptions, ...userOptions});

  console.log(site)

  new VueApollo({
    clients: {
      admin,
      site,
      user
    },
    defaultClient: site,
  })
}

VueComponent.vue

<template>
    <div class="w-full">
      {{companies}}
    </div>
</template>

<script>
import gql from 'graphql-tag'

export default {
  name: 'AdminCompanyList',
  apollo: {
    $client: 'admin',
    // Simple query that will update the 'hello' vue property
    companies: gql`query {
      companies {
        id
        name
      }
    }`,
  }
}
</script>