Hi all,

Long time reader, first time poster.

I'm trying to get this to work in my nuxt app with a connection to shopify and a local graphql api but not having much luck so far. Both the Shopify and local API work in postman respectively and i can call various queries in both, but as soon as I add them both in my config like the below:

runtimeConfig: {
    public: {
      JWT_SECRET: process.env.JWT_SECRET,
      gql: {
        clients: {
          shopify: {
            default: true,
            host: 'https://zzz.myshopify.com/api/2022-07/graphql.json',
            token: {
              name: 'X-Shopify-Storefront-Access-Token',
              value: 'zzzz', 
              type: null 
            },
            retainToken: true
          },
          concord: {
            host: `http://localhost:8080/graphql`,
            value: 'zzzzzzz'
          }          
        }
      }
    }
  }

In queries/shopify/cartCreate.gql along with a few other queries for shopify stuff

mutation cartCreate {
    cartCreate {
        cart {
            checkoutUrl
            id
        }
        userErrors {
            field
            message
        }
    }
}

In queries/concord/test.gql folder I just have 1 query

query concord_test {
  diamondProductsExternal {
    edges {
      node {
        shape
        id
      }
    }
  }
}

I get this error. Not really sure whats going on here as I can't find anything about PageInfo anywhere. Could it be something cached. Is there a way to clear the build cache or something like that?

Cannot start nuxt:                                                                                                                                                                                                                                                        16:25:40
        Failed to load schema from https://zzz.myshopify.com/api/2022-07/graphql.json,http://localhost:8080/graphql:

        Unable to merge GraphQL type "PageInfo": Field "endCursor" already defined with a different type. Declared as "ConnectionCursor", but you tried to override with "String"
        Error: Unable to merge GraphQL type "PageInfo": Field "endCursor" already defined with a different type. Declared as "ConnectionCursor", but you tried to override with "String"
    at mergeType (file:///D:/zzz/sf/node_modules/@graphql-tools/merge/esm/typedefs-mergers/type.js:23:19)
    at mergeGraphQLNodes (file:///D:/zzz/sf/node_modules/@graphql-tools/merge/esm/typedefs-mergers/merge-nodes.js:34:49)
    at mergeGraphQLTypes (file:///D:/zzz/sf/node_modules/@graphql-tools/merge/esm/typedefs-mergers/merge-typedefs.js:63:25)
    at mergeTypeDefs (file:///D:/zzz/sf/node_modules/@graphql-tools/merge/esm/typedefs-mergers/merge-typedefs.js:10:22)
    at makeExecutableSchema (file:///D:/zzz/sf/node_modules/@graphql-tools/schema/esm/makeExecutableSchema.js:69:32)
    at mergeSchemas (file:///D:/zzz/sf/node_modules/@graphql-tools/schema/esm/merge-schemas.js:29:12)
    at getSchemaFromSources (file:///D:/zzz/sf/node_modules/@graphql-tools/load/esm/schema.js:51:20)
    at loadSchema (file:///D:/zzz/sf/node_modules/@graphql-tools/load/esm/schema.js:16:12)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
    at async loadSchema (file:///D:/zzz/sf/node_modules/@graphql-codegen/cli/esm/load.js:33:24)

        GraphQL Code Generator supports:
          - ES Modules and CommonJS exports (export as default or named export "schema")
          - Introspection JSON File
          - URL of GraphQL endpoint
          - Multiple files with type definitions (glob expression)
          - String in config file

        Try to use one of above options and run codegen again.

I am getting an error

ERROR  Cannot start nuxt:  The requested module '@graphql-codegen/plugin-helpers' does not provide an export named 'DetailedError'                                                         12:03:52

  import { DetailedError, createNoopProfiler } from '@graphql-codegen/plugin-helpers';
  ^^^^^^^^^^^^^
  SyntaxError: The requested module '@graphql-codegen/plugin-helpers' does not provide an export named 'DetailedError'
  at ModuleJob._instantiate (node:internal/modules/esm/module_job:124:21)
  at async ModuleJob.run (node:internal/modules/esm/module_job:181:5)
  at async Promise.all (index 0)
  at async ESMLoader.import (node:internal/modules/esm/loader:281:24)
  at async normalizeModule (node_modules/@nuxt/kit/dist/index.mjs:476:26)
  at async installModule (node_modules/@nuxt/kit/dist/index.mjs:455:41)
  at async initNuxt (node_modules/nuxt/dist/index.mjs:1606:7)
  at async load (node_modules/nuxi/dist/chunks/dev.mjs:6778:9)
  at async Object.invoke (node_modules/nuxi/dist/chunks/dev.mjs:6828:5)
  at async _main (node_modules/nuxi/dist/cli.mjs:50:20)

I guess it might be because of the recent update to the graphql-code-generator more specifically because of this PR where they have removed the DetailedError

I just found the project here and read #3. Now I have the following question/feature request:

Will the implementation of an access token and a refresh token setup be supported in the future? E.g. if an error message "token expired" comes back, you automatically call a defined query to generate a new access token with its refresh token (HTTP cookie) and then the original query is automatically executed again.

Hey!

This is probably an issue based on my lack of knowledge about Nuxt. But I can't find a way to solve it.

I have a Nuxt middleware that makes sure that a user is authenticated before allowing them to navigate to certain pages. The authentication is based on sessions, and a cookie needs to be sent with every request to my graphql api.

This works great in SPA mode: the cookie is passed directly from the browser to the API. However, on initial page load, when the app runs in SSR mode, the cookie is not passed along to the API. This means that if a user logs in and navigates to a restricted page, then refreshes the window, they are redirected to the login screen even though they have a session.

How can I make sure that the SSR code passes along the cookie?

Here is the code for the middleware:

export default defineNuxtRouteMiddleware(async (to, from) => {
  const user = useState("user");
  if (!user.value) {
    try {
      const { data } = await useAsyncGql("userinfo");
      if (data.value.user) {
        user.value = data.value.user;
      } else {
        return navigateTo({
          path: "/login",
          query: {
            reason: "No user info",
          },
        });
      }
    } catch (err) {
      return navigateTo({
        path: "/login",
        query: {
          reason: 'request error',
        },
      });
    }
  }
});

Thanks in advance.

Hi there

I just saw that the demo with the SpaceX API is failing under: https://stackblitz.com/github/diizzayy/nuxt-graphql-client-demo

I got the same error in local with the exact same setup.

Environment

• Operating System: Linux
• Node Version: v16.18.1
• Nuxt Version: 3.0.0
• Nitro Version: 1.0.0
• Package Manager: [email protected]
• Builder: vite
• User Config: alias, experimental, build, app, sourcemap, dir, typescript, modules, vite, runtimeConfig
• Runtime Modules: (), @pinia/[email protected], [email protected], @vueuse/[email protected]
• Build Modules: -

Describe the bug

I've upgraded to Nuxt v3 stable and latest version of lib and updated all imports to #gql. Now it can't build

Works fine in nuxt dev, fails in nuxt build

Expected behaviour

Project builds

Reproduction

No response

Additional context

runtimeConfig: {
        public: {
            'graphql-client': {
                codegen: {
                    onlyOperationTypes: false,
                },
            },
        },
    },

Logs

ℹ Client built in 11342ms
ℹ Building server...
✔ Server built in 8706ms
✔ Generated public .output/public
ℹ Building Nitro Server (preset: node-server)
src/components/views/catalog/CatalogCardPresentation.vue(27,28): error TS2307: Cannot find module '#gql/default' or its corresponding type declarations.

Hi I'm trying to connect with my Keystone JS app. I need to use a mutation to make a login and get the user's token. This is login.gql:

type Mutation { authenticateUserWithPassword(email: String!, password: String!): UserAuthenticationWithPasswordResult! }

type Query { authenticatedItem: AuthenticatedItem }

union AuthenticatedItem = User

union UserAuthenticationWithPasswordResult = UserAuthenticationWithPasswordSuccess | UserAuthenticationWithPasswordFailure

type UserAuthenticationWithPasswordSuccess { sessionToken: String! item: User! }

type UserAuthenticationWithPasswordFailure { message: String! }

mutation { authenticateUserWithPassword( email: "[email protected]", password: "1234567890" ) { ... on UserAuthenticationWithPasswordSuccess { item { id name email } } ... on UserAuthenticationWithPasswordFailure { message } } }

I get those error when I run npm run dev: Unknown type "UserAuthenticationWithPasswordSuccess" Unknown type "UserAuthenticationWithPasswordFailure"

Do I doing something wrong? Thanks

I am trying to do call for data from my CMS with the same Token in two different places, a component(Header) and a NuxtPage(Body). One page load, both useAsyncData calls work and the page works as expected. However, if I change the NuxtPage with a NuxtLink, and hence need to fetch new data for that page, I get a '401 Unauthorized' Error from my CMS (datoCMS). I am using the refreshnuxtdata to do that data refresh and it seems like that function is not sending the token?

This seems like the most relevant code but let me know if you need more information

const { data } = await useAsyncData("allworkGet", () => GqlLaunches());
const refresh = () => refreshNuxtData('allworkGet')

Things I tried

Didn't Work, even though GQL_TOKEN is in .env

function refreshFunc(){
    const config = useRuntimeConfig();
    console.log('URL:',config.GQL_HOST);
    // logs the URL
    console.log('URL:',config.GQL_TOKEN);
    // logs undefined
    useGqlToken(config.GQL_TOKEN);
    refreshNuxtData('allworkGet');
}

const refresh = () => refreshFunc()

Did work but seems to be a bad solution to have to add my token by hand

function refreshFunc(){

    useGqlToken('my_tokens_string');
    refreshNuxtData('allworkGet');
}

When you remove the .nuxt folder (e.g. with npx nuxi clean) and try to start dev mode, this plugin crashes because it's trying to run TS before the .nuxt folder is generated.

It looks like this module is running some typescript compilation before the .nuxt folder is generated, and since tsconfig.json depends on a config file in .nuxt, it will fail to run at all:

  error TS5083: Cannot read file '.nuxt/tsconfig.json'.

  at createTSError (node_modules/ts-node/src/index.ts:859:12)
  at reportTSError (node_modules/ts-node/src/index.ts:863:19)
  at createFromPreloadedConfig (node_modules/ts-node/src/index.ts:874:36)
  at create (node_modules/ts-node/src/index.ts:624:10)
  at register (node_modules/ts-node/src/index.ts:591:15)
  at TypeScriptLoader (node_modules/cosmiconfig-typescript-loader/dist/cjs/index.js:52:54)
  at node_modules/@graphql-codegen/cli/esm/config.js:16:18
  at ModuleJob.run (node:internal/modules/esm/module_job:198:25)
  at async Promise.all (index 0)
  at async ESMLoader.import (node:internal/modules/esm/loader:385:24)
  at async normalizeModule (node_modules/nuxt/node_modules/@nuxt/kit/dist/index.mjs:476:26)
  at async installModule (node_modules/nuxt/node_modules/@nuxt/kit/dist/index.mjs:455:41)
  at async initNuxt (node_modules/nuxt/dist/index.mjs:1606:7)
  at async load (node_modules/nuxi/dist/chunks/dev.mjs:6778:9)
  at async Object.invoke (node_modules/nuxi/dist/chunks/dev.mjs:6828:5)
  at async _main (node_modules/nuxi/dist/cli.mjs:50:20)

Hi, our graphql API does not provide introspection on the main endpoint of graphql host. Is there possibility to disable generating or setup different url to get introspection ?

I lack the documentation needed to fire the same query multiple times within a session and it actually making a request to the graphql endpoint each time, instead of only once and the using cached data.

Your use case

My naming scheme is lowercase with an underscore between words, so my GQL query is get_users, and the Nuxt prefix I used is "gql_" so the final form for the front end is gql_Get_users - because of the forced uppercase on the first char of the query.

The solution you'd like

I want to be able to edit an option and use lowercase as the first char and use "gql_get_users"

Possible alternatives

No response

Additional information

No response

Bumps vitest from 0.25.8 to 0.26.3.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Bumps @vitest/coverage-c8 from 0.25.8 to 0.26.3.

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Environment

• Operating System: Darwin
• Node Version: v16.17.0
• Nuxt Version: 3.0.0
• Nitro Version: 1.0.0
• Package Manager: [email protected]
• Builder: vite
• User Config: typescript, telemetry, modules, runtimeConfig
• Runtime Modules: @unocss/[email protected], @unocss/[email protected], [email protected]
• Build Modules: -

Describe the bug

When I'm starting up nuxt with nuxt dev I always get thrown the error

 ERROR  [unhandledRejection] First parameter has member 'readable' that is not a ReadableStream.                                                                                     10:46:09

  at assertReadableStream (node_modules/ohmyfetch/node_modules/node-fetch-native/dist/shared/node-fetch-native.b703cef9.mjs:428:21)
  at convertReadableWritablePair (node_modules/ohmyfetch/node_modules/node-fetch-native/dist/shared/node-fetch-native.b703cef9.mjs:3505:11)
  at ReadableStream.pipeThrough (node_modules/ohmyfetch/node_modules/node-fetch-native/dist/shared/node-fetch-native.b703cef9.mjs:3580:33)
  at fetchFinale (node_modules/undici/lib/fetch/index.js:976:52)
  at mainFetch (node_modules/undici/lib/fetch/index.js:776:5)
  at processTicksAndRejections (node:internal/process/task_queues:96:5)

Tracing the strack trace it comes from the generate function, when running the graphql codegen.

const outputFiles = await context.profiler.run(() => executeCodegen(context), "executeCodegen");

This is run with the following config:

Generate {                                                                                                                   11:09:28
  clients: {
    default: {
      token: [Object],
      proxyCookies: true,
      tokenStorage: [Object],
      preferGETQueries: false,
      host: 'http://localhost:8888/api/graphql'                                                                              11:09:26
    }
  },
  plugins: [
    'typescript',
    'typescript-operations',
    'typescript-graphql-request'
  ],
  documents: [
     // list of my graphql-files
  ],
  resolver: {
    resolve: [Function: resolve],
    resolvePath: [Function: resolvePath]
  },
  clientDocs: {
    default: [
     // list of my graphql-files
    ]
  },
  silent: true,
  skipTypename: true,
  useTypeImports: true,
  dedupeFragments: true,
  disableOnBuild: false,
  onlyOperationTypes: true
} {
  silent: true,
  generates: {
    'default.ts': {
      config: [Object],
      schema: [Array],
      plugins: [Array],
      documents: [Array]
    }
  }
}

Environment

• Operating System: Windows_NT
• Node Version: v19.2.0
• Nuxt Version: 3.0.0
• Nitro Version: 1.0.0
• Package Manager: [email protected]
• Builder: vite
• User Config: app, css, alias, runtimeConfig, modules, graphql-client
• Runtime Modules: @pinia/[email protected], [email protected]
• Build Modules: -

Describe the bug

warning "nuxt-graphql-client > @graphql-codegen/[email protected]" has unmet peer dependency "graphql-tag@^2.0.0". warning "nuxt-graphql-client > @graphql-codegen/cli > [email protected]" has unmet peer dependency "@types/node@". warning "nuxt-graphql-client > @graphql-codegen/cli > [email protected]" has unmet peer dependency "ts-node@>=10". warning "nuxt-graphql-client > @graphql-codegen/cli > [email protected]" has unmet peer dependency "typescript@>=3". warning "nuxt-graphql-client > @graphql-codegen/cli > graphql-config > [email protected]" has unmet peer dependency "@types/node@". warning "nuxt-graphql-client > @graphql-codegen/cli > graphql-config > [email protected]" has unmet peer dependency "typescript@>=3". warning "nuxt-graphql-client > @graphql-codegen/cli > graphql-config > [email protected]" has unmet peer dependency "@types/node@*". warning "nuxt-graphql-client > @graphql-codegen/cli > graphql-config > [email protected]" has unmet peer dependency "typescript@>=2.7". warning "nuxt-graphql-client > @graphql-codegen/cli > @graphql-tools/code-file-loader > @graphql-tools/graphql-tag-pluck > @babel/[email protected]" has unmet peer dependency "@babel/core@^7.0.0-0".

Expected behaviour

remove warnings

Reproduction

No response

Additional context

No response

Logs

No response

Your use case

I'd like to implement persisted queries.

The solution you'd like

I think this could be achieved by being able to pass along a query id to the server, or even better, some kind of integration with persistgraphql or something like it, as I see that repo is now archived.

Possible alternatives

No response

Additional information

No response