Skip to content

Missing client in apolloProvider when using custom client in smart query #658

Description

@stummjr

Environment

  • Operating System: Darwin
  • Node Version: v22.18.0
  • Nuxt Version: 3.17.7
  • CLI Version: 3.26.2
  • Nitro Version: 2.12.2
  • Package Manager: yarn@1.22.22
  • Builder: -
  • User Config: compatibilityDate, devtools, modules, pages, components, ssr, css, vue, apollo, vuetify, app, hooks, runtimeConfig
  • Runtime Modules: @nuxt/eslint@1.5.2, @nuxt/image@1.10.0, @pinia/nuxt@0.11.1, @nuxtjs/apollo@5.0.0-alpha.14, @sentry/nuxt/module@9.42.0, vuetify-nuxt-module@0.18.7
  • Build Modules: -

Describe the bug

My project defines two Apollo clients in nuxt.config.ts: default and noauth.

apollo: {
  autoImports: true,
  clients: {
    default: {
      httpEndpoint: process.env.BASE_URL + '/graphql',
      browserHttpEndpoint: process.env.BASE_URL + '/graphql',
      ...
    },
    noauth: {
      httpEndpoint: process.env.BASE_URL + '/public/graphql',
      browserHttpEndpoint: process.env.BASE_URL + '/public/graphql',
      ...
    }
  }
}

When I try using a non-default client in a Smart Query, like this:

  apollo: {
    plans: {
      query: plans,
      client: 'noauth',
    }
  }

I get this error:

[vue-apollo] Missing client 'noauth' in 'apolloProvider'

at DollarApollo.getClient (http://localhost:3000/_nuxt/node_modules/@vue/apollo-option/dist/vue-apollo-option.esm.mjs?v=52ce178c:1130:21)
at DollarApollo.watchQuery (http://localhost:3000/_nuxt/node_modules/@vue/apollo-option/dist/vue-apollo-option.esm.mjs?v=52ce178c:1152:29)
at SmartQuery.executeApollo (http://localhost:3000/_nuxt/node_modules/@vue/apollo-option/dist/vue-apollo-option.esm.mjs?v=52ce178c:742:39)
at SmartQuery.start (http://localhost:3000/_nuxt/node_modules/@vue/apollo-option/dist/vue-apollo-option.esm.mjs?v=52ce178c:529:14)
at SmartQuery.autostart (http://localhost:3000/_nuxt/node_modules/@vue/apollo-option/dist/vue-apollo-option.esm.mjs?v=52ce178c:424:14)
at DollarApollo.addSmartQuery (http://localhost:3000/_nuxt/node_modules/@vue/apollo-option/dist/vue-apollo-option.esm.mjs?v=52ce178c:1223:15)
at Proxy.launch (http://localhost:3000/_nuxt/node_modules/@vue/apollo-option/dist/vue-apollo-option.esm.mjs?v=52ce178c:1361:34)
at callWithErrorHandling (http://localhost:3000/_nuxt/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?v=52ce178c:197:33)
at callWithAsyncErrorHandling (http://localhost:3000/_nuxt/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?v=52ce178c:204:17)
at callHook (http://localhost:3000/_nuxt/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?v=52ce178c:3670:3)

Looking at this project's source code, it looks like only the default client is added to the Apollo provider here. Is that right?

How can I tell a smart query how to use a non-default client?

Expected behaviour

The query runs using the noauth client, reaching the /public/graphql URL.

Reproduction

No response

Additional context

Similar issues have been reported before: #628

Looks like this line should become something like this:

nuxtApp.vueApp.use(createApolloProvider({ clients, defaultClient: clients?.default }))

That's documented here: https://apollo.vuejs.org/guide-option/multiple-clients#multiple-clients

Logs

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions