@lewebsimple/nuxt-graphql 0.7.0 → 0.7.2

package/README.md

@@ -188,7 +188,6 @@ That's it! You can now use Nuxt GraphQL in your Nuxt app ✨
 Fragments are fully supported and are the recommended way to share selection sets across operations.
 
 - Fragment names must be unique across all `.gql` files (duplicates throw during generation).
-- Fragment types are re-exported from `#graphql/types`.
 - Fragments are not executable by themselves and are not part of the registry.
 
 Example with a fragment:
@@ -209,12 +208,14 @@ query SwapiFilms {
 }
 ```
 
-From TypeScript, you can also use fragment types explicitly when needed:
+From TypeScript, you can also use fragment types explicitly when needed (see below):
 
 ```ts
-import type { TheFilmFragment } from "#graphql/types";
+import type { TheFilmFragment, SwapiFilmsVariables } from "#graphql/types";
 ```
 
+⚠️ These types are inferred from the Zod schemas and cannot be used as top-level in component props, i.e. `defineProps<TheFilmFragment>()` breaks but `defineProps<{ film: TheFilmFragment }>()` works just fine.
+
 ### Use the auto-imported composables
 
 The auto-imported composables allow executing queries, mutations, and subscriptions based on their registry name with full type-safety (variables and return value).
@@ -249,6 +250,14 @@ export default defineEventHandler(async (event) => {
 
 Server helpers return a `ExecuteGraphQLResult` in the same format as some composables, i.e. `{ data: TResult, error: null } | { data: null, error: NormalizedError }`
 
+### Type-safety
+
+All enum, fragment and operation variables & result types are re-exported from `#graphql/types` for your convenience:
+
+```ts
+import type { TheFilmFragment } from "#graphql/types";
+```
+
 ### Query caching (client-side only)
 
 `useAsyncGraphQLQuery` can cache query results based on the global cache configuration and per-query overrides.

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "nuxt-graphql",
   "configKey": "graphql",
-  "version": "0.7.0",
+  "version": "0.7.2",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -1,6 +1,7 @@
 import { mkdir, writeFile } from 'node:fs/promises';
 import { relative, resolve, parse, dirname } from 'node:path';
 import { stitchSchemas } from '@graphql-tools/stitch';
+import { extendSchemaWithZodDirectives } from '@lewebsimple/graphql-codegen-zod/extend-schema';
 import { createResolver, addTemplate, addTypeTemplate, defineNuxtModule, useLogger, addServerImports, updateTemplates, addServerHandler, addPlugin, addImportsDir, addServerImportsDir } from '@nuxt/kit';
 import { defu } from 'defu';
 import { parse as parse$1, printSchema, lexicographicSortSchema, getIntrospectionQuery, buildClientSchema, GraphQLSchema, buildSchema } from 'graphql';
@@ -15,7 +16,7 @@ import zodPreset from '@lewebsimple/graphql-codegen-zod';
 import { createRequire } from 'node:module';
 import { resolveCacheConfig } from '../dist/runtime/app/lib/cache-config.js';
 
-const version = "0.7.0";
+const version = "0.7.2";
 
 const buildCache = /* @__PURE__ */ new Map();
 function getCachedLoader(baseKey, loader) {
@@ -291,7 +292,7 @@ async function resolveSchemaDefs(schemaDefs, nuxt) {
     })
   );
 }
-function getRemoteSchemaServerTemplate({
+function getRemoteSchemaTemplate({
   endpoint,
   headers,
   hooks,
@@ -318,8 +319,9 @@ export const schema = {
 };
 `.trim();
 }
-function getSchemaServerTemplate({ localPaths, remotePaths }) {
+function getSchemaTemplate({ localPaths, remotePaths }) {
   const imports = [
+    `import { extendSchemaWithZodDirectives } from "@lewebsimple/graphql-codegen-zod/extend-schema";`,
     ...localPaths.map(
       (schemaPath, index) => `import { schema as localSchema${index} } from ${JSON.stringify(schemaPath)};`
     ),
@@ -341,13 +343,19 @@ function getSchemaServerTemplate({ localPaths, remotePaths }) {
   if (schemaRefs.length === 0) {
     imports.unshift(`import {  buildSchema } from "graphql";`);
     schemaRef = `buildSchema("type Query { _empty: String }")`;
-  } else if (schemaRefs.length === 1) {
+  } else if (remoteSchemaRefs.length === 0) {
     schemaRef = schemaRefs[0];
   } else {
     imports.unshift(`import { stitchSchemas } from "@graphql-tools/stitch";`);
     schemaRef = `stitchSchemas({ subschemas: [${schemaRefs.join(", ")}] })`;
   }
-  return [...imports, "", `export const schema = ${schemaRef};`].join("\n");
+  return [
+    ...imports,
+    "",
+    `export const schema = extendSchemaWithZodDirectives(`,
+    `  ${schemaRef},`,
+    `);`
+  ].join("\n");
 }
 async function loadLocalSchema(path, nuxt) {
   const { createJiti } = await import('jiti');
@@ -458,7 +466,7 @@ const module$1 = defineNuxtModule({
           await addCompiledTemplate(
             {
               filename: `graphql/schemas/remote-${index}`,
-              getContents: async () => getRemoteSchemaServerTemplate({
+              getContents: async () => getRemoteSchemaTemplate({
                 ...schemaDef,
                 sdl: getSchemaSDL(await schemaLoader())
               })
@@ -473,7 +481,7 @@ const module$1 = defineNuxtModule({
     const { dst: schemaDst } = await addCompiledTemplate(
       {
         filename: "graphql/schema",
-        getContents: () => getSchemaServerTemplate(schemaInput)
+        getContents: () => getSchemaTemplate(schemaInput)
       },
       nuxt
     );
@@ -494,6 +502,7 @@ const module$1 = defineNuxtModule({
           throw new Error("Failed to load GraphQL schema");
         }
       }
+      schema = extendSchemaWithZodDirectives(schema);
       if (nuxt.options.dev) {
         const sdl = getSchemaSDL(schema);
         await writeFile(sdlPath, sdl);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lewebsimple/nuxt-graphql",
-  "version": "0.7.0",
+  "version": "0.7.2",
   "description": "Opinionated Nuxt module for using GraphQL",
   "license": "AGPL-3.0-only",
   "repository": "lewebsimple/nuxt-graphql",
@@ -34,13 +34,12 @@
     "@graphql-tools/graphql-file-loader": "^8.1.12",
     "@graphql-tools/load": "^8.1.8",
     "@graphql-tools/schema": "^10.0.31",
-    "@graphql-tools/stitch": "^10.1.15",
+    "@graphql-tools/stitch": "^10.1.16",
     "@graphql-typed-document-node/core": "^3.2.0",
-    "@lewebsimple/graphql-codegen-zod": "^0.1.6",
+    "@lewebsimple/graphql-codegen-zod": "^0.2.0",
     "@nuxt/kit": "^4.4.2",
     "defu": "^6.1.4",
     "es-toolkit": "^1.45.1",
-    "graphql": "^16.13.1",
     "graphql-sse": "^2.6.0",
     "graphql-yoga": "^5.18.1",
     "jiti": "^2.6.1",
@@ -50,22 +49,24 @@
   },
   "devDependencies": {
     "@graphql-codegen/plugin-helpers": "^6.2.0",
-    "@nuxt/devtools": "^3.2.3",
+    "@nuxt/devtools": "^3.2.4",
     "@nuxt/module-builder": "^1.0.2",
     "@nuxt/schema": "^4.4.2",
     "@nuxt/test-utils": "^4.0.0",
     "@types/node": "latest",
     "@types/picomatch": "^4.0.2",
     "changelogen": "^0.6.2",
+    "graphql": "^16.13.1",
     "nuxt": "^4.4.2",
     "oxfmt": "^0.41.0",
     "oxlint": "^1.56.0",
     "typescript": "~5.9.3",
     "vitest": "^4.1.0",
-    "vue-tsc": "^3.2.5",
+    "vue-tsc": "^3.2.6",
     "zod": "^4.3.6"
   },
   "peerDependencies": {
+    "graphql": "^16",
     "zod": "^4"
   },
   "scripts": {