nitro-graphql 0.2.0 → 0.2.2

package/README.md

@@ -36,17 +36,30 @@
 
 ### Step 1: Installation
 
-Choose your preferred package manager:
+Choose your GraphQL framework and install required dependencies:
 
+**For GraphQL Yoga:**
 ```bash
 # npm
-npm install nitro-graphql
+npm install nitro-graphql graphql-yoga graphql
 
 # pnpm (recommended)
-pnpm add nitro-graphql
+pnpm add nitro-graphql graphql-yoga graphql
 
 # yarn
-yarn add nitro-graphql
+yarn add nitro-graphql graphql-yoga graphql
+```
+
+**For Apollo Server:**
+```bash
+# npm
+npm install nitro-graphql @apollo/server graphql
+
+# pnpm (recommended)
+pnpm add nitro-graphql @apollo/server graphql
+
+# yarn
+yarn add nitro-graphql @apollo/server graphql
 ```
 
 ### Step 2: Setup Your Project
@@ -112,7 +125,9 @@ type Query {
   greeting(name: String!): String!
 }
 
-type Mutation
+type Mutation {
+  _empty: String
+}
 ```
 
 ### Step 4: Create Your First Resolver
@@ -176,6 +191,7 @@ server/
 │   │   ├── post-queries.resolver.ts # Post query resolvers (use named exports)
 │   │   └── create-post.resolver.ts  # Post mutation resolvers (use named exports)
 │   └── config.ts                   # Optional GraphQL configuration
+│   └── schema.ts                   # Changing Special Return types
 ```
 
 > [!TIP]
@@ -321,6 +337,52 @@ The module automatically generates TypeScript types for you:
 
 Your IDE will automatically provide type safety and autocomplete!
 
+#### Using Generated Types
+
+You can import and use the generated types in your code:
+
+**Client-side types** (`#graphql/client`):
+```ts
+// Import generated types for queries, mutations, and operations
+import type { GetUsersQuery, CreateUserInput } from '#graphql/client'
+
+// Use in Vue components
+const users = ref<GetUsersQuery['users']>([])
+
+// Use in composables
+export function useUsers() {
+  const createUser = async (input: CreateUserInput) => {
+    // Type-safe input
+  }
+}
+```
+
+**Server-side types** (`#graphql/server`):
+```ts
+// Import generated types and interfaces
+import type { User, Post, CreateUserInput } from '#graphql/server'
+
+// Use types in your server code
+function validateUser(user: User): boolean {
+  return user.email.includes('@')
+}
+
+// Use in data layer
+async function getUserPosts(user: User): Promise<Post[]> {
+  // user is fully typed with all fields
+  return await db.posts.findMany({ where: { authorId: user.id } })
+}
+
+// Use input types for validation
+function validateCreateUserInput(input: CreateUserInput): void {
+  if (!input.email || !input.name) {
+    throw new Error('Email and name are required')
+  }
+}
+```
+
+These imports provide full TypeScript support with autocompletion, type checking, and IntelliSense in your IDE.
+
 > [!TIP]
 > **Nitro Auto-Imports**: Thanks to Nitro's auto-import feature, you don't need to manually import `defineResolver`, `defineQuery`, `defineMutation`, and other utilities in your resolver files. They're available globally! However, if you prefer explicit imports, you can use:
 > ```ts
@@ -560,6 +622,7 @@ export const postTypes = defineType({
 You can override schema types if needed. StandardSchema supported — Zod, Valibot, anything works:
 
 ```ts
+# server/graphql/schema.ts
 import { defineSchema } from 'nitro-graphql/utils/define'
 import { z } from 'zod'
 
@@ -1007,6 +1070,53 @@ const client = createGraphQLClient({
 > [!IMPORTANT]
 > Please don't forget to read the [Contribution Guidelines](CONTRIBUTING.md) document before contributing.
 
+## 📋 Community TODOs
+
+Help us improve nitro-graphql! Pick any item and contribute:
+
+### 🚀 Framework Examples
+- [ ] Nitro-compatible framework integrations
+- [ ] Nuxt + Pinia Colada example
+- [ ] StackBlitz playground demos
+
+### 🧹 Code Quality
+- [ ] Performance benchmarks
+- [ ] Bundle size optimization
+- [ ] Testing utilities
+- [ ] Error handling patterns
+
+### 📚 Documentation  
+- [ ] Video tutorials
+- [ ] Migration guides
+- [ ] Best practices guide
+
+### 🔧 Developer Tools
+- [ ] VS Code extension
+- [ ] CLI tools
+- [ ] Debug utilities
+
+### 🌐 Integrations
+- [ ] Database adapters (Prisma, Drizzle)
+- [ ] Cache strategies
+- [ ] Deployment guides
+
+> [!NOTE]
+> Have other ideas? Open an issue to discuss!
+
+## 🛠️ VS Code Extensions
+
+For the best development experience with GraphQL, install these recommended VS Code extensions:
+
+- **[GraphQL: Language Feature Support](https://marketplace.visualstudio.com/items?itemName=GraphQL.vscode-graphql)** - Provides GraphQL language features like autocompletion, go-to definition, and schema validation
+- **[GraphQL: Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=GraphQL.vscode-graphql-syntax)** - Adds syntax highlighting for GraphQL queries, mutations, subscriptions, and schema files
+
+These extensions will enable:
+- 🎨 Syntax highlighting for `.graphql` files
+- 📝 IntelliSense and autocompletion based on your schema
+- ✅ Real-time validation of GraphQL queries
+- 🔍 Go-to definition for types and fields
+- 💡 Hover information for GraphQL elements
+
 ---
 
 ### 🌟 Thank You

package/dist/ecosystem/nuxt.d.ts

@@ -1,7 +1,7 @@
-import * as _nuxt_schema7 from "@nuxt/schema";
+import * as _nuxt_schema4 from "@nuxt/schema";
 
 //#region src/ecosystem/nuxt.d.ts
 interface ModuleOptions {}
-declare const _default: _nuxt_schema7.NuxtModule<ModuleOptions, ModuleOptions, false>;
+declare const _default: _nuxt_schema4.NuxtModule<ModuleOptions, ModuleOptions, false>;
 //#endregion
 export { ModuleOptions, _default as default };

package/dist/index.d.ts

@@ -1,9 +1,9 @@
 import { StandardSchemaV1 } from "./types/standard-schema.js";
 import { CodegenClientConfig, CodegenServerConfig, GenImport, NitroGraphQLOptions } from "./types/index.js";
-import * as nitropack2 from "nitropack";
+import * as nitropack5 from "nitropack";
 
 //#region src/index.d.ts
 type GraphQLFramework = 'graphql-yoga';
-declare const _default: nitropack2.NitroModule;
+declare const _default: nitropack5.NitroModule;
 //#endregion
 export { CodegenClientConfig, CodegenServerConfig, GenImport, GraphQLFramework, NitroGraphQLOptions, StandardSchemaV1, _default as default };

package/dist/index.js

@@ -128,7 +128,7 @@ var src_default = defineNitroModule({
 				return void 0;
 			};
 			rollupConfig$1.output.chunkFileNames = (chunkInfo) => {
-				if (chunkInfo.moduleIds && chunkInfo.moduleIds.some((id) => id.includes("/graphql/") || id.includes(".graphql") || id.includes(".resolver.ts") || id.includes(".gql"))) return `chunks/graphql/[name].mjs`;
+				if (chunkInfo.moduleIds && chunkInfo.moduleIds.some((id) => id.endsWith(".graphql") || id.endsWith(".resolver.ts") || id.endsWith(".gql"))) return `chunks/graphql/[name].mjs`;
 				if (typeof chunkFiles === "function") return chunkFiles(chunkInfo);
 				return `chunks/_/[name].mjs`;
 			};
@@ -149,7 +149,7 @@ declare module 'nitro-graphql' {
 			types.tsConfig.compilerOptions.paths ??= {};
 			types.tsConfig.compilerOptions.paths["#graphql/server"] = [relativeWithDot(tsconfigDir, join(typesDir, "nitro-graphql-server.d.ts"))];
 			types.tsConfig.compilerOptions.paths["#graphql/client"] = [relativeWithDot(tsconfigDir, join(typesDir, "nitro-graphql-client.d.ts"))];
-			types.tsConfig.compilerOptions.paths["#graphql/schemas"] = [relativeWithDot(tsconfigDir, join(nitro.graphql.serverDir, "schemas.ts"))];
+			types.tsConfig.compilerOptions.paths["#graphql/schema"] = [relativeWithDot(tsconfigDir, join(nitro.graphql.serverDir, "schema.ts"))];
 			types.tsConfig.include = types.tsConfig.include || [];
 			types.tsConfig.include.push(relativeWithDot(tsconfigDir, join(typesDir, "nitro-graphql-server.d.ts")), relativeWithDot(tsconfigDir, join(typesDir, "nitro-graphql-client.d.ts")), relativeWithDot(tsconfigDir, join(typesDir, "graphql.d.ts")));
 		});

package/dist/rollup.js

@@ -1,5 +1,6 @@
 import { getImportId, scanGraphql } from "./utils/index.js";
 import { serverTypeGeneration } from "./utils/server-type-generation.js";
+import { resolve } from "pathe";
 import { readFile } from "node:fs/promises";
 import { parse } from "graphql";
 import { genImport } from "knitwork";
@@ -8,6 +9,7 @@ import { genImport } from "knitwork";
 async function rollupConfig(app) {
 	virtualDefs(app);
 	virtualResolvers(app);
+	getGraphQLConfig(app);
 	app.hooks.hook("rollup:before", (nitro, rollupConfig$1) => {
 		rollupConfig$1.plugins = rollupConfig$1.plugins || [];
 		const { include = /\.(graphql|gql)$/i, exclude, validate = false } = app.options.graphql?.loader || {};
@@ -82,6 +84,16 @@ function virtualResolvers(app) {
 		return code;
 	};
 }
+function getGraphQLConfig(app) {
+	const configPath = resolve(app.graphql.serverDir, "config.ts");
+	app.options.virtual ??= {};
+	app.options.virtual["#nitro-internal-virtual/graphql-config"] = () => {
+		return `import config from '${configPath}'
+const importedConfig = config
+export { importedConfig }
+`;
+	};
+}
 
 //#endregion
 export { rollupConfig };

package/dist/routes/apollo-server.d.ts

@@ -1,6 +1,6 @@
-import * as h35 from "h3";
+import * as h32 from "h3";
 
 //#region src/routes/apollo-server.d.ts
-declare const _default: h35.EventHandler<h35.EventHandlerRequest, any>;
+declare const _default: h32.EventHandler<h32.EventHandlerRequest, any>;
 //#endregion
 export { _default as default };

package/dist/routes/apollo-server.js

@@ -1,5 +1,7 @@
 import { startServerAndCreateH3Handler } from "../utils/apollo.js";
+import defu from "defu";
 import { mergeResolvers, mergeTypeDefs } from "@graphql-tools/merge";
+import { importedConfig } from "#nitro-internal-virtual/graphql-config";
 import { defs } from "#nitro-internal-virtual/server-defs";
 import { resolvers } from "#nitro-internal-virtual/server-resolvers";
 import { ApolloServer } from "@apollo/server";
@@ -24,12 +26,12 @@ let apolloServer;
 function createApolloServer() {
 	if (!apolloServer) {
 		const { typeDefs, resolvers: mergedResolvers } = createMergedSchema();
-		apolloServer = new ApolloServer({
+		apolloServer = new ApolloServer(defu({
 			typeDefs,
 			resolvers: mergedResolvers,
 			introspection: true,
 			plugins: [ApolloServerPluginLandingPageLocalDefault({ embed: true })]
-		});
+		}, importedConfig));
 	}
 	return apolloServer;
 }

package/dist/routes/graphql-yoga.js

@@ -1,4 +1,6 @@
+import defu from "defu";
 import { mergeResolvers, mergeTypeDefs } from "@graphql-tools/merge";
+import { importedConfig } from "#nitro-internal-virtual/graphql-config";
 import { defs } from "#nitro-internal-virtual/server-defs";
 import { resolvers } from "#nitro-internal-virtual/server-resolvers";
 import { defineEventHandler, toWebRequest } from "h3";
@@ -40,12 +42,12 @@ let yoga;
 var graphql_yoga_default = defineEventHandler(async (event) => {
 	if (!yoga) {
 		const schema = createMergedSchema();
-		yoga = createYoga({
+		yoga = createYoga(defu({
 			schema,
 			graphqlEndpoint: "/api/graphql",
 			landingPage: false,
 			renderGraphiQL: () => apolloSandboxHtml
-		});
+		}, importedConfig));
 	}
 	const request = toWebRequest(event);
 	const response = await yoga.handleRequest(request, event);

package/dist/routes/health.d.ts

@@ -1,7 +1,7 @@
-import * as h33 from "h3";
+import * as h36 from "h3";
 
 //#region src/routes/health.d.ts
-declare const _default: h33.EventHandler<h33.EventHandlerRequest, Promise<{
+declare const _default: h36.EventHandler<h36.EventHandlerRequest, Promise<{
   status: string;
   message: string;
   timestamp: string;

package/dist/utils/server-codegen.js

@@ -55,7 +55,7 @@ async function generateTypes(schema, config = {}, outputPath) {
 			imports: { plugin: () => {
 				return {
 					prepend: [
-						`import schemas from '#graphql/schemas'`,
+						`import schemas from '#graphql/schema'`,
 						`import type { StandardSchemaV1 } from 'nitro-graphql'`,
 						`
 export type SchemaType = Partial<Record<Partial<keyof ResolversTypes>, StandardSchemaV1>>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "nitro-graphql",
   "type": "module",
-  "version": "0.2.0",
+  "version": "0.2.2",
   "description": "GraphQL integration for Nitro",
   "license": "MIT",
   "sideEffects": false,