@lewebsimple/nuxt-graphql 0.5.13 → 0.6.1

package/README.md

@@ -18,7 +18,7 @@ Opinionated Nuxt module that wires a typed GraphQL server + client into your app
 - 🧠 **Type-safe helpers** for **queries, mutations, and subscriptions**, shared across **client + server**
 - 🧊 **SSR-friendly** by default: request header forwarding + server-side schema execution helpers
 - 🚀 **Client-side cache** for `useAsyncGraphQLQuery` (cache policies + optional persistence in localStorage)
-- 🧯 **Unified error model** via `SafeResult` and `NormalizedError`
+- 🧯 **Unified error model** via `GraphQLExecutionResult` and `NormalizedError`
 
 
 ## Getting started
@@ -38,13 +38,12 @@ Declare your schemas, context, documents glob and optional client cache in [nuxt
 export default defineNuxtConfig({
   modules: ["@lewebsimple/nuxt-graphql"],
   graphql: {
-    yoga: {
+    server: {
       // Schemas to stitch together (local and/or remote)
-      schemas: {
-        local: {
-          type: "local",
-          path: "server/graphql/schema.ts",
-        },
+      schema: {
+        // Local schema example
+        local: { type: "local", path: "server/graphql/schema.ts" },
+      
         // Remote schema example
         swapi: {
           type: "remote",
@@ -91,7 +90,7 @@ export default defineNuxtConfig({
 ```
 
 
-### Define schema(s) (local and/or remote)
+### Define GraphQL schema (local and/or remote)
 
 **Local schemas** must live under `server/` and export a `GraphQLSchema` as `schema`.
 
@@ -134,12 +133,14 @@ export const schema = createSchema<GraphQLContext>({
 });
 ```
 
-**Remote schemas** are introspected at build time from the required endpoint URL and executed via an HTTP executor at runtime. Subscriptions are stripped from remote schemas.
+**Remote schemas** are introspected at build time from the endpoint URL and executed via an HTTP executor at runtime. Subscriptions are stripped from remote schemas.
+
+The final schema is stitched from the all of the defined local / remote schemas.
 
 
-### Define GraphQL context factories (optional)
+### Define GraphQL context (optional)
 
-Context factories are optional and run on the server in order. Their return types are merged into a single `GraphQLContext` type. You can use the auto-imported `defineGraphQLContext` helper for type-safety.
+Context definition is optional and factories resolve in order on the server. Their return types are merged into a single `GraphQLContext` type which is exported from `#graphql/context`. You can use the auto-imported `defineGraphQLContext` helper for type-safety.
 
 For example, create [server/graphql/context.ts](server/graphql/context.ts):
 
@@ -157,15 +158,10 @@ export default defineGraphQLContext(async (event) => {
 
 ### Write GraphQL documents (.gql)
 
-Write operations in `.gql` files; operation names become registry keys like `useGraphQLQuery("HelloWorld")`.
+By default, the module scans `**/*.gql` files for **named operations** and **fragments** which are converted into **types** and **typed document nodes** in `#graphql/operations`. The operations are exposed by name in `#graphql/registry` to allow type-safe execution with the provided **composables** and **server utils**.
 
 ⚠️ Operation names are required and must be unique.
 
-By default, the module scans `**/*.gql` and generates:
-
-- Typed documents and operations / fragments types in virtual modules under the `#graphql/operations` alias (internal)
-- Operation registry in virtual modules under the `#graphql/registry` alias (internal)
-
 Example document files:
 
 ```graphql
@@ -231,25 +227,13 @@ The auto-imported composables allow executing queries, mutations, and subscripti
 
 ```ts
 // Cached query via useAsyncData
-const { data, pending, error, refresh } = await useAsyncGraphQLQuery(
-  "HelloWorld",
-  undefined,
-  {
-    headers: {
-      "X-Request-Header": "request-header-value",
-    },
-  },
-);
+const { data, pending, error, refresh } = await useAsyncGraphQLQuery("HelloWorld", undefined);
 
 // Direct HTTP query (SafeResult)
 const { data: queryData, error: queryError } = await useGraphQLQuery("HelloWorld");
 
 // Mutation (SafeResult)
-const { mutate, pending: mutationPending } = useGraphQLMutation("Ping", {
-  headers: {
-    "X-Request-Header": "request-header-value",
-  },
-});
+const { mutate, pending: mutationPending } = useGraphQLMutation("Ping");
 const { data: mutationData, error: mutationError } = await mutate({ message: "Hello!" });
 
 // Subscription (client-only, SSE)
@@ -257,30 +241,24 @@ const { data, error, start, stop } = useGraphQLSubscription("Time");
 ```
 
 
-### Use the auto-imported server-side utilities
+### Use the auto-imported server utils
 
 In server routes, you can execute queries and mutations directly against the stitched schema (no HTTP roundtrip):
 
 ```ts
 export default defineEventHandler(async (event) => {
   // Server-side GraphQL query example
-  const { data: queryData, error: queryError } = await useServerGraphQLQuery(
-    event,
-    "HelloWorld",
-  );
+  const { data: queryData, error: queryError } = await useGraphQLOperation(event, "HelloWorld" );
 
   // Server-side GraphQL mutation example
-  const { data: mutationData } = await useServerGraphQLMutation(
-    event,
-    "Ping",
-    { message: queryData?.hello ?? "fallback" },
+  const { data: mutationData } = await useGraphQLOperation(event, "Ping", { message: queryData?.hello ?? "Pong" },
   );
 
   return { queryData, mutationData, queryError };
 });
 ```
 
-Server helpers return a `SafeResult` in the same format as the client helpers.
+Server helpers return a `GraphQLExecutionResult` in the same format as some composables, i.e. `{ data: TResult, error: null } | { data: null, error: NormalizedError }`
 
 
 ### Query caching (client-side only)
@@ -293,10 +271,10 @@ Server helpers return a `SafeResult` in the same format as the client helpers.
 
 #### Cache policies
 
-- "no-cache": always fetches from the network (still dedupes in-flight).
-- "cache-first": returns cached value when present, otherwise fetches.
-- "network-first": tries the network first, falls back to cached value on error.
-- "swr": returns cached value immediately and refreshes in the background.
+- `"no-cache"`: always fetches from the network (still dedupes in-flight).
+- `"cache-first"`: returns cached value when present, otherwise fetches.
+- `"network-first"`: tries the network first, falls back to cached value on error.
+- `"swr"`: returns cached value immediately and refreshes in the background.
 
 #### Per-query overrides
 
@@ -334,20 +312,16 @@ You can define custom logic around the remote executor for each remote schema by
 For the example configuration above, create [server/graphql/swapi-hooks.ts](server/graphql/swapi-hooks.ts):
 
 ```ts
+import { defu } from "defu";
+
 export default defineRemoteExecutorHooks({
   onRequest(request) {
-    // Dynamically inject headers
-    request.extensions ??= {};
-    request.extensions.headers = {
-      ...request.extensions.headers,
-      "X-Remote-Exec-Request-Header": "custom-value",
-    };
-  },
-  onResult(result) {
-    console.log("Remote result", result);
-  },
-  onError(error) {
-    console.error("Remote error", error);
+    const { remoteAuthToken } = request.context || {};
+    request.extensions = defu(request.extensions, {
+      headers: {
+        "XAuthorization": `Bearer ${remoteAuthToken || ""}`,
+      },
+    });
   },
 });
 ```

package/dist/module.d.mts

@@ -1,4 +1,6 @@
 import * as _nuxt_schema from '@nuxt/schema';
+import { HeadersInput } from '../dist/runtime/shared/lib/headers.js';
+import { CacheConfig } from '../dist/runtime/app/lib/cache.js';
 
 type LocalSchemaDef = {
     type: "local";
@@ -13,52 +15,17 @@ type RemoteSchemaDef = {
 type SchemaDef = LocalSchemaDef | RemoteSchemaDef;
 
 interface NuxtGraphQLModuleOptions {
-    /**
-     * Client-side GraphQL configuration (HTTP + cache).
-     */
     client?: {
-        /**
-         * Global cache configuration for queries.
-         */
-        cache?: Partial<GraphQLCacheConfig>;
-        /**
-         * GraphQL documents glob pattern.
-         * Default: "**\/*.gql"
-         */
         documents?: string;
-        /**
-         * Headers forwarded from the SSR request to graphql-request.
-         * Default: ["authorization", "cookie"]
-         */
+        cache?: Partial<CacheConfig>;
         ssrForwardHeaders?: string[];
     };
-    /**
-     * Where to write graphql.config.json.
-     * Resolved from rootDir.
-     * Default: ./graphql.config.json
-     */
-    saveConfig?: string;
-    /**
-     * Where to write the stitched GraphQL SDL.
-     * Resolved from rootDir.
-     * Default: server/graphql/schema.graphql
-     */
-    saveSDL?: string;
-    /**
-     * Server-side GraphQL configuration (Yoga server + execution).
-     */
     server?: {
-        /**
-         * Paths to GraphQL server context factories relative to rootDir.
-         * export default defineGraphQLContext((event: H3Event) => Promise<Record<string, unknown>>)
-         */
         context?: string[];
-        /**
-         * GraphQL schema definition.
-         * Key = schemaName.
-         */
         schema?: Record<string, SchemaDef>;
     };
+    saveConfig?: string;
+    saveSDL?: string;
 }
 declare const _default: _nuxt_schema.NuxtModule<NuxtGraphQLModuleOptions, NuxtGraphQLModuleOptions, false>;
 

package/dist/module.json

@@ -1,7 +1,7 @@
 {
-  "name": "nuxt-graphql",
+  "name": "@lewebsimple/nuxt-graphql",
   "configKey": "graphql",
-  "version": "0.5.13",
+  "version": "0.6.1",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "3.6.1"

package/dist/module.mjs

@@ -2,17 +2,17 @@ import { mkdirSync, writeFileSync } from 'node:fs';
 import { relative, resolve, dirname } from 'node:path';
 import { defu } from 'defu';
 import { stitchSchemas } from '@graphql-tools/stitch';
-import { defineNuxtModule, useLogger, createResolver, addTemplate, addServerTemplate, addTypeTemplate, addServerHandler, addPlugin, addImportsDir, addServerImportsDir } from '@nuxt/kit';
+import { addTemplate, addServerTemplate, defineNuxtModule, useLogger, createResolver, addServerHandler, addPlugin, addImportsDir, addServerImportsDir } from '@nuxt/kit';
 import { hash } from 'ohash';
 import { createRequire } from 'node:module';
 import { printSchema, lexicographicSortSchema, buildSchema, getIntrospectionQuery, buildClientSchema, GraphQLSchema, Kind } from 'graphql';
-import { resolveCacheConfig } from '../dist/runtime/shared/lib/cache.js';
 import { loadDocuments } from '@graphql-tools/load';
 import { GraphQLFileLoader } from '@graphql-tools/graphql-file-loader';
 import { codegen } from '@graphql-codegen/core';
 import * as typescriptPlugin from '@graphql-codegen/typescript';
 import * as typescriptOperationsPlugin from '@graphql-codegen/typescript-operations';
 import * as typedDocumentNodePlugin from '@graphql-codegen/typed-document-node';
+import { resolveCacheConfig } from '../dist/runtime/app/lib/cache.js';
 
 const buildCache = /* @__PURE__ */ new Map();
 function getCachedLoader(baseKey, loader) {
@@ -118,9 +118,7 @@ ${localImports.join("\n")}
 ${remoteImports.join("\n")}
 
 export const schema = stitchSchemas({
-  subschemas: [
-    ${[mergedSchema, ...remoteSchemas].join(",\n    ")}
-  ],
+  subschemas: [${[mergedSchema, ...remoteSchemas].join(", ")}],
 });
   `.trim();
   return { ts, ...splitModule(ts) };
@@ -134,24 +132,18 @@ async function loadLocalSchema({ importPath }) {
   }
   return module.schema;
 }
-function getSchemaSDL(schema) {
-  return printSchema(lexicographicSortSchema(schema));
-}
-function getDefaultSchema() {
-  return buildSchema(`type Query { _empty: String }`);
-}
-
 async function getRemoteSchemaTemplate({ endpoint, headers, hooks, loadSchema }) {
   const hooksImports = hooks.map((hook, index) => `import hook${index} from ${JSON.stringify(hook.importPath)};`);
   const hooksArray = hooks.map((_, index) => `hook${index}`);
   const schema = await loadSchema();
   const sdl = getSchemaSDL(schema);
   const ts = `
+import type { GraphQLSchema } from "graphql";
 import { buildSchema } from "graphql";
-import { createRemoteExecutor } from "#graphql/runtime/remote-executor";
+import { getRemoteExecutor } from "#graphql/runtime/remote-executor";
 ${hooksImports.join("\n")}
 
-const executor = createRemoteExecutor({
+const executor = getRemoteExecutor({
   endpoint: "${endpoint}",
   headers: ${JSON.stringify(headers)},
   hooks: [${hooksArray.join(", ")}],
@@ -163,7 +155,7 @@ const sdl = \`${sdl.replace(/`/g, "\\`")}\`;
 export const schema = {
   schema: buildSchema(sdl),
   executor,
-}
+} as unknown as GraphQLSchema;
   `.trim();
   return { ts, ...splitModule(ts) };
 }
@@ -192,83 +184,26 @@ function stripSubscriptions(schema) {
     directives: schema.getDirectives()
   });
 }
-
-function getAppTypesTemplate() {
-  return `
-import type { GraphQLClient } from "graphql-request";
-import type { Client as SSEClient } from "graphql-sse";
-
-declare module "#app/nuxt" {
-  interface NuxtApp {
-    $getGraphQLClient: () => GraphQLClient;
-    $getGraphQLSSEClient: () => SSEClient;
-  }
-}
-
-declare module "#app" {
-  interface NuxtApp {
-    $getGraphQLClient: () => GraphQLClient;
-    $getGraphQLSSEClient: () => SSEClient;
-  }
-}
-
-export {};
-`.trim();
-}
-function getServerTypesTemplate() {
-  return `
-import type { ExecutionRequest, ExecutionResult } from "@graphql-tools/utils";
-
-declare module "h3" {
-  interface H3EventContext {
-    _graphqlInFlightRequestsMap?: Map<string, Promise<unknown>>;
-  }
-}
-
-declare module "#graphql/runtime/remote-executor" {
-  export type CreateRemoteExecutorInput = {
-    endpoint: string;
-    headers: HeadersInput;
-    hooks: GraphQLRemoteExecHooks[];
-  };
-
-  export function createRemoteExecutor(options: {
-    endpoint: string;
-    headers: Record<string, string>;
-    hooks: GraphQLRemoteExecHooks[];
-  }): Executor;
-}
-
-export {};
-`.trim();
+function getSchemaSDL(schema) {
+  return printSchema(lexicographicSortSchema(schema));
 }
-function getSharedTypesTemplate() {
-  return `
-import type { DocumentNode } from "graphql";
-
-declare global {
-  type GraphQLCacheConfig = {
-    policy: "no-cache" | "cache-first" | "network-first" | "swr";
-    ttl?: number;
-    keyPrefix: string;
-    keyVersion: string | number;
-  };
-
-  export type HeadersInput = Record<string, string | null>;
+function getDefaultSchema() {
+  return buildSchema(`type Query { _empty: String }`);
 }
 
-declare module "nuxt/schema" {
-  interface PublicRuntimeConfig {
-    graphql: {
-      cacheConfig: GraphQLCacheConfig;
-      ssrForwardHeaders: string[];
-    };
+function addUniversalTemplate({ filename, getContents, emitTs }) {
+  let modulePath;
+  if (emitTs) {
+    modulePath = addTemplate({ filename: `${filename}.ts`, getContents: async () => (await getContents()).ts, write: true }).dst;
+  } else {
+    modulePath = addTemplate({ filename: `${filename}.mjs`, getContents: async () => (await getContents()).mjs, write: true }).dst;
+    addTemplate({ filename: `${filename}.d.ts`, getContents: async () => (await getContents()).dts });
   }
+  addServerTemplate({ filename: `${filename}.mjs`, getContents: async () => (await getContents()).mjs });
+  return modulePath;
 }
 
-export { };
-`.trim();
-}
+const version = "0.6.1";
 
 async function getDocuments(documentsGlob) {
   try {
@@ -406,12 +341,13 @@ function collectOperations(documents) {
 
 const module$1 = defineNuxtModule({
   meta: {
-    name: "nuxt-graphql",
+    name: "@lewebsimple/nuxt-graphql",
     configKey: "graphql"
   },
   defaults: {},
   async setup(options, nuxt) {
     const logger = useLogger("@lewebsimple/nuxt-graphql");
+    logger.info(`@lewebsimple/nuxt-graphql v${version} loaded`);
     const { resolve: resolveModule } = createResolver(import.meta.url);
     const { rootDir } = nuxt.options;
     const { resolve: resolveRoot, resolvePath: rawResolveRootPath } = createResolver(rootDir);
@@ -420,22 +356,15 @@ const module$1 = defineNuxtModule({
     }
     const nuxtAliases = {};
     const nitroAliases = {};
+    const emitTs = Boolean(nuxt.options.dev) || Boolean(process.env.NUXT_MODULE_PREPARE);
+    nuxtAliases["#graphql/runtime/remote-executor"] = resolveModule("./runtime/server/lib/remote-executor");
+    nitroAliases["#graphql/runtime/remote-executor"] = resolveModule("./runtime/server/lib/remote-executor");
     const contextInput = {
       importPaths: await Promise.all((options.server?.context || []).map((path) => resolveRootPath(path)))
     };
-    let contextDst;
-    if (nuxt.options.dev || process.env.NUXT_MODULE_PREPARE) {
-      contextDst = addTemplate({ filename: "graphql/context.ts", getContents: () => getContextTemplate(contextInput).ts, write: true }).dst;
-      addServerTemplate({ filename: "graphql/context.mjs", getContents: () => getContextTemplate(contextInput).mjs });
-    } else {
-      contextDst = addTemplate({ filename: "graphql/context.mjs", getContents: () => getContextTemplate(contextInput).mjs, write: true }).dst;
-      addServerTemplate({ filename: "graphql/context.mjs", getContents: () => getContextTemplate(contextInput).mjs });
-      addTypeTemplate({ filename: "graphql/context.d.ts", getContents: () => getContextTemplate(contextInput).dts });
-    }
-    nuxtAliases["#graphql/context"] = contextDst;
-    nitroAliases["#graphql/context"] = contextDst;
-    nuxtAliases["#graphql/runtime/remote-executor"] = resolveModule("./runtime/server/lib/remote-executor");
-    nitroAliases["#graphql/runtime/remote-executor"] = resolveModule("./runtime/server/lib/remote-executor");
+    const contextPath = addUniversalTemplate({ filename: "graphql/context", getContents: () => getContextTemplate(contextInput), emitTs });
+    nuxtAliases["#graphql/context"] = contextPath;
+    nitroAliases["#graphql/context"] = contextPath;
     const schemaInput = { local: {}, remote: {} };
     const schemaLoaders = {};
     for (const [schemaName, schemaDef] of Object.entries(options.server?.schema || {})) {
@@ -444,34 +373,24 @@ const module$1 = defineNuxtModule({
       }
       if (schemaDef.type === "local") {
         const importPath = await resolveRootPath(schemaDef.path);
+        const loadSchema2 = getCachedLoader(`schema:local:${schemaName}`, async () => await loadLocalSchema({ importPath }));
         schemaInput.local[schemaName] = { importPath };
-        schemaLoaders[schemaName] = getCachedLoader(`schema:local:${schemaName}`, async () => await loadLocalSchema({ importPath }));
+        schemaLoaders[schemaName] = loadSchema2;
       } else if (schemaDef.type === "remote") {
         const { endpoint } = schemaDef;
-        const remoteSchemaInput = {
-          endpoint,
-          headers: schemaDef.headers || {},
-          hooks: await Promise.all((schemaDef.hooks || []).map(async (hookPath) => ({ importPath: await resolveRootPath(hookPath) }))),
-          loadSchema: getCachedLoader(`schema:remote:${schemaName}`, async () => await introspectRemoteSchema({ endpoint }))
-        };
-        if (nuxt.options.dev) {
-          addTemplate({ filename: `graphql/schemas/${schemaName}.ts`, getContents: async () => (await getRemoteSchemaTemplate(remoteSchemaInput)).ts, write: true });
-          addServerTemplate({ filename: `graphql/schemas/${schemaName}.ts`, getContents: async () => (await getRemoteSchemaTemplate(remoteSchemaInput)).ts });
-        } else {
-          addTemplate({ filename: `graphql/schemas/${schemaName}.mjs`, getContents: async () => (await getRemoteSchemaTemplate(remoteSchemaInput)).mjs, write: true });
-          addServerTemplate({ filename: `graphql/schemas/${schemaName}.mjs`, getContents: async () => (await getRemoteSchemaTemplate(remoteSchemaInput)).mjs });
-          addTypeTemplate({ filename: `graphql/schemas/${schemaName}.d.ts`, getContents: async () => (await getRemoteSchemaTemplate(remoteSchemaInput)).dts });
-        }
+        const loadSchema2 = getCachedLoader(`schema:remote:${schemaName}`, async () => await introspectRemoteSchema({ endpoint }));
+        const hooks = await Promise.all((schemaDef.hooks || []).map(async (hookPath) => ({ importPath: await resolveRootPath(hookPath) })));
+        const remoteSchemaInput = { endpoint, headers: schemaDef.headers || {}, hooks, loadSchema: loadSchema2 };
+        addUniversalTemplate({ filename: `graphql/schemas/${schemaName}`, getContents: () => getRemoteSchemaTemplate(remoteSchemaInput), emitTs });
         schemaInput.remote[schemaName] = { importPath: `./schemas/${schemaName}` };
-        schemaLoaders[schemaName] = remoteSchemaInput.loadSchema;
+        schemaLoaders[schemaName] = loadSchema2;
       } else {
         throw new Error(`Unknown schema type for schema "${schemaName}"`);
       }
     }
-    const schemaDst = addTemplate({ filename: `graphql/schema.ts`, getContents: () => getSchemaTemplate(schemaInput).ts, write: true }).dst;
-    addServerTemplate({ filename: `graphql/schema.ts`, getContents: () => getSchemaTemplate(schemaInput).ts });
-    nuxtAliases["#graphql/schema"] = schemaDst;
-    nitroAliases["#graphql/schema"] = schemaDst;
+    const schemaPath = addUniversalTemplate({ filename: "graphql/schema", getContents: () => getSchemaTemplate(schemaInput), emitTs });
+    nuxtAliases["#graphql/schema"] = schemaPath;
+    nitroAliases["#graphql/schema"] = schemaPath;
     const sdlPath = resolveRoot(options.saveSDL || "server/graphql/schema.graphql");
     const loadSchema = getCachedLoader("schema:stitched", async () => {
       const subschemas = await Promise.all(Object.values(schemaLoaders).map((loadSchema2) => loadSchema2()));
@@ -495,37 +414,14 @@ const module$1 = defineNuxtModule({
       }
       return documents;
     });
-    const operationsInput = {
-      loadSchema,
-      loadDocuments,
-      documentGlob: options.client?.documents || "**/*.gql"
-    };
-    let operationsDst;
-    if (nuxt.options.dev || process.env.NUXT_MODULE_PREPARE) {
-      operationsDst = addTemplate({ filename: "graphql/operations.ts", getContents: async () => (await getOperationsTemplate(operationsInput)).ts, write: true }).dst;
-      addServerTemplate({ filename: "graphql/operations.ts", getContents: async () => (await getOperationsTemplate(operationsInput)).ts });
-    } else {
-      operationsDst = addTemplate({ filename: "graphql/operations.mjs", getContents: async () => (await getOperationsTemplate(operationsInput)).mjs, write: true }).dst;
-      addServerTemplate({ filename: "graphql/operations.mjs", getContents: async () => (await getOperationsTemplate(operationsInput)).mjs });
-      addTypeTemplate({ filename: "graphql/operations.d.ts", getContents: async () => (await getOperationsTemplate(operationsInput)).dts });
-    }
-    nuxtAliases["#graphql/operations"] = operationsDst;
-    nitroAliases["#graphql/operations"] = operationsDst;
-    const registryInput = {
-      loadDocuments,
-      documentGlob: options.client?.documents || "**/*.gql"
-    };
-    let registryDst;
-    if (nuxt.options.dev || process.env.NUXT_MODULE_PREPARE) {
-      registryDst = addTemplate({ filename: "graphql/registry.ts", getContents: async () => (await getRegistryTemplate(registryInput)).ts, write: true }).dst;
-      addServerTemplate({ filename: "graphql/registry.ts", getContents: async () => (await getRegistryTemplate(registryInput)).ts });
-    } else {
-      registryDst = addTemplate({ filename: "graphql/registry.mjs", getContents: async () => (await getRegistryTemplate(registryInput)).mjs, write: true }).dst;
-      addServerTemplate({ filename: "graphql/registry.mjs", getContents: async () => (await getRegistryTemplate(registryInput)).mjs });
-      addTypeTemplate({ filename: "graphql/registry.d.ts", getContents: async () => (await getRegistryTemplate(registryInput)).dts });
-    }
-    nuxtAliases["#graphql/registry"] = registryDst;
-    nitroAliases["#graphql/registry"] = registryDst;
+    const operationsInput = { loadSchema, loadDocuments, documentGlob: options.client?.documents || "**/*.gql" };
+    const operationsPath = addUniversalTemplate({ filename: "graphql/operations", getContents: () => getOperationsTemplate(operationsInput), emitTs });
+    nuxtAliases["#graphql/operations"] = operationsPath;
+    nitroAliases["#graphql/operations"] = operationsPath;
+    const registryInput = { loadDocuments, documentGlob: options.client?.documents || "**/*.gql" };
+    const registryPath = addUniversalTemplate({ filename: "graphql/registry", getContents: () => getRegistryTemplate(registryInput), emitTs });
+    nuxtAliases["#graphql/registry"] = registryPath;
+    nitroAliases["#graphql/registry"] = registryPath;
     if (nuxt.options.dev) {
       const configPath = resolveRoot(options.saveConfig || "graphql.config.json");
       const config = {
@@ -540,9 +436,6 @@ const module$1 = defineNuxtModule({
     nuxt.hook("nitro:config", (nitroConfig) => {
       nitroConfig.alias = defu(nitroConfig.alias, nitroAliases);
     });
-    addTypeTemplate({ filename: "types/nuxt-graphql.app.d.ts", getContents: () => getAppTypesTemplate() }, { nuxt: true });
-    addTypeTemplate({ filename: "types/nuxt-graphql.server.d.ts", getContents: () => getServerTypesTemplate() }, { nitro: true, node: true });
-    addTypeTemplate({ filename: "types/nuxt-graphql.shared.d.ts", getContents: () => getSharedTypesTemplate() }, { nuxt: true, nitro: true, node: true });
     nuxt.options.runtimeConfig.public.graphql = defu(nuxt.options.runtimeConfig.public.graphql, {
       cacheConfig: resolveCacheConfig(options.client?.cache),
       ssrForwardHeaders: options.client?.ssrForwardHeaders || ["authorization", "cookie"]
@@ -560,9 +453,10 @@ const module$1 = defineNuxtModule({
     nuxt.hook("listen", (_, { url }) => {
       logger.success(`GraphQL Yoga ready: ${cyan}${url.replace(/\/$/, "")}/api/graphql${reset}`);
     });
-    addPlugin(resolveModule("./runtime/app/plugins/graphql-request"));
+    addPlugin(resolveModule("./runtime/app/plugins/execute-graphql"));
     addPlugin(resolveModule("./runtime/app/plugins/graphql-sse.client"));
     addImportsDir(resolveModule("./runtime/app/composables"));
+    addImportsDir(resolveModule("./runtime/shared/utils"));
     addServerImportsDir(resolveModule("./runtime/server/utils"));
   }
 });

package/dist/runtime/app/composables/useAsyncGraphQLQuery.d.ts

@@ -1,11 +1,11 @@
-import { useAsyncData, type AsyncDataOptions } from "#app";
+import { type AsyncData, type AsyncDataOptions } from "#app";
 import type { QueryName, ResultOf, VariablesOf } from "#graphql/registry";
 import { type MaybeRefOrGetter } from "#imports";
-import { type ExecuteGraphQLHTTPOptions } from "../lib/execute-http.js";
-import type { IsEmptyObject } from "../../shared/lib/utils.js";
-type UseAsyncGraphQLQueryOptions<TName extends QueryName> = ExecuteGraphQLHTTPOptions & {
-    cache?: Partial<GraphQLCacheConfig>;
-} & AsyncDataOptions<ResultOf<TName>>;
+import type { IsEmptyObject } from "../../shared/lib/types.js";
+import { type CacheConfig } from "../lib/cache.js";
+type UseAsyncGraphQLQueryOptions<TName extends QueryName> = AsyncDataOptions<ResultOf<TName>> & {
+    cache?: Partial<CacheConfig>;
+};
 /**
  * Async GraphQL query composable with caching support.
  *
@@ -13,5 +13,5 @@ type UseAsyncGraphQLQueryOptions<TName extends QueryName> = ExecuteGraphQLHTTPOp
  * @param args Operation variables (if any) and optional HTTP headers.
  * @returns Nuxt AsyncData wrapper for the query result.
  */
-export declare function useAsyncGraphQLQuery<TName extends QueryName>(operationName: TName, ...args: IsEmptyObject<VariablesOf<TName>> extends true ? [variables?: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>] : [variables: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>]): ReturnType<typeof useAsyncData<ResultOf<TName>>>;
+export declare function useAsyncGraphQLQuery<TName extends QueryName>(operationName: TName, ...args: IsEmptyObject<VariablesOf<TName>> extends true ? [variables?: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>] : [variables: MaybeRefOrGetter<VariablesOf<TName>>, options?: UseAsyncGraphQLQueryOptions<TName>]): AsyncData<ResultOf<TName> | null, Error | undefined>;
 export {};

package/dist/runtime/app/composables/useAsyncGraphQLQuery.js

@@ -1,14 +1,16 @@
-import { useAsyncData, useNuxtData, useRuntimeConfig } from "#app";
+import { useAsyncData, useNuxtApp, useNuxtData, useRuntimeConfig } from "#app";
 import { computed, toValue } from "#imports";
-import { executeGraphQLHTTP } from "../lib/execute-http.js";
+import { getOperationDocument } from "../../shared/lib/registry.js";
+import { getCacheKeyParts, resolveCacheConfig } from "../lib/cache.js";
 import { getInFlightRequests } from "../lib/in-flight.js";
 import { getPersistedEntry, setPersistedEntry } from "../lib/persisted.js";
-import { getCacheKeyParts, resolveCacheConfig } from "../../shared/lib/cache.js";
 export function useAsyncGraphQLQuery(operationName, ...args) {
+  const { $executeGraphQL } = useNuxtApp();
   const [variables, options] = args;
+  const document = getOperationDocument(operationName);
   const isClient = import.meta.client;
   const { public: { graphql } } = useRuntimeConfig();
-  const { headers, cache, ...asyncDataOptions } = options ?? {};
+  const { cache, ...asyncDataOptions } = options ?? {};
   const cacheConfig = resolveCacheConfig(graphql.cacheConfig, cache);
   const cacheKey = computed(() => getCacheKeyParts(cacheConfig, operationName, toValue(variables)).key);
   const inFlight = getInFlightRequests();
@@ -17,16 +19,18 @@ export function useAsyncGraphQLQuery(operationName, ...args) {
     if (inFlight.has(key)) {
       return inFlight.get(key);
     }
-    const promise = executeGraphQLHTTP(operationName, toValue(variables), { headers }).then((data) => {
+    const promise = $executeGraphQL({ query: document, variables: toValue(variables), operationName }).then((result) => {
+      if (result.error) {
+        throw result.error;
+      }
+      const data = result.data;
       if (isClient && cacheConfig.ttl !== void 0) {
         setPersistedEntry(key, data, cacheConfig.ttl);
       }
       return data;
     });
     inFlight.set(key, promise);
-    promise.finally(() => {
-      inFlight.delete(key);
-    });
+    promise.finally(() => inFlight.delete(key));
     return promise;
   }
   async function asyncDataHandler() {