nitro-graphql 0.2.0 โ 0.2.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +113 -5
- package/dist/ecosystem/nuxt.d.ts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +1 -1
- package/dist/rollup.js +12 -0
- package/dist/routes/apollo-server.d.ts +2 -2
- package/dist/routes/apollo-server.js +4 -2
- package/dist/routes/graphql-yoga.d.ts +2 -2
- package/dist/routes/graphql-yoga.js +4 -2
- package/dist/routes/health.d.ts +2 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -36,17 +36,30 @@
|
|
|
36
36
|
|
|
37
37
|
### Step 1: Installation
|
|
38
38
|
|
|
39
|
-
Choose your
|
|
39
|
+
Choose your GraphQL framework and install required dependencies:
|
|
40
40
|
|
|
41
|
+
**For GraphQL Yoga:**
|
|
41
42
|
```bash
|
|
42
43
|
# npm
|
|
43
|
-
npm install nitro-graphql
|
|
44
|
+
npm install nitro-graphql graphql-yoga graphql
|
|
44
45
|
|
|
45
46
|
# pnpm (recommended)
|
|
46
|
-
pnpm add nitro-graphql
|
|
47
|
+
pnpm add nitro-graphql graphql-yoga graphql
|
|
47
48
|
|
|
48
49
|
# yarn
|
|
49
|
-
yarn add nitro-graphql
|
|
50
|
+
yarn add nitro-graphql graphql-yoga graphql
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
**For Apollo Server:**
|
|
54
|
+
```bash
|
|
55
|
+
# npm
|
|
56
|
+
npm install nitro-graphql @apollo/server graphql
|
|
57
|
+
|
|
58
|
+
# pnpm (recommended)
|
|
59
|
+
pnpm add nitro-graphql @apollo/server graphql
|
|
60
|
+
|
|
61
|
+
# yarn
|
|
62
|
+
yarn add nitro-graphql @apollo/server graphql
|
|
50
63
|
```
|
|
51
64
|
|
|
52
65
|
### Step 2: Setup Your Project
|
|
@@ -112,7 +125,9 @@ type Query {
|
|
|
112
125
|
greeting(name: String!): String!
|
|
113
126
|
}
|
|
114
127
|
|
|
115
|
-
type Mutation
|
|
128
|
+
type Mutation {
|
|
129
|
+
_empty: String
|
|
130
|
+
}
|
|
116
131
|
```
|
|
117
132
|
|
|
118
133
|
### Step 4: Create Your First Resolver
|
|
@@ -321,6 +336,52 @@ The module automatically generates TypeScript types for you:
|
|
|
321
336
|
|
|
322
337
|
Your IDE will automatically provide type safety and autocomplete!
|
|
323
338
|
|
|
339
|
+
#### Using Generated Types
|
|
340
|
+
|
|
341
|
+
You can import and use the generated types in your code:
|
|
342
|
+
|
|
343
|
+
**Client-side types** (`#graphql/client`):
|
|
344
|
+
```ts
|
|
345
|
+
// Import generated types for queries, mutations, and operations
|
|
346
|
+
import type { GetUsersQuery, CreateUserInput } from '#graphql/client'
|
|
347
|
+
|
|
348
|
+
// Use in Vue components
|
|
349
|
+
const users = ref<GetUsersQuery['users']>([])
|
|
350
|
+
|
|
351
|
+
// Use in composables
|
|
352
|
+
export function useUsers() {
|
|
353
|
+
const createUser = async (input: CreateUserInput) => {
|
|
354
|
+
// Type-safe input
|
|
355
|
+
}
|
|
356
|
+
}
|
|
357
|
+
```
|
|
358
|
+
|
|
359
|
+
**Server-side types** (`#graphql/server`):
|
|
360
|
+
```ts
|
|
361
|
+
// Import generated types and interfaces
|
|
362
|
+
import type { User, Post, CreateUserInput } from '#graphql/server'
|
|
363
|
+
|
|
364
|
+
// Use types in your server code
|
|
365
|
+
function validateUser(user: User): boolean {
|
|
366
|
+
return user.email.includes('@')
|
|
367
|
+
}
|
|
368
|
+
|
|
369
|
+
// Use in data layer
|
|
370
|
+
async function getUserPosts(user: User): Promise<Post[]> {
|
|
371
|
+
// user is fully typed with all fields
|
|
372
|
+
return await db.posts.findMany({ where: { authorId: user.id } })
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
// Use input types for validation
|
|
376
|
+
function validateCreateUserInput(input: CreateUserInput): void {
|
|
377
|
+
if (!input.email || !input.name) {
|
|
378
|
+
throw new Error('Email and name are required')
|
|
379
|
+
}
|
|
380
|
+
}
|
|
381
|
+
```
|
|
382
|
+
|
|
383
|
+
These imports provide full TypeScript support with autocompletion, type checking, and IntelliSense in your IDE.
|
|
384
|
+
|
|
324
385
|
> [!TIP]
|
|
325
386
|
> **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:
|
|
326
387
|
> ```ts
|
|
@@ -1007,6 +1068,53 @@ const client = createGraphQLClient({
|
|
|
1007
1068
|
> [!IMPORTANT]
|
|
1008
1069
|
> Please don't forget to read the [Contribution Guidelines](CONTRIBUTING.md) document before contributing.
|
|
1009
1070
|
|
|
1071
|
+
## ๐ Community TODOs
|
|
1072
|
+
|
|
1073
|
+
Help us improve nitro-graphql! Pick any item and contribute:
|
|
1074
|
+
|
|
1075
|
+
### ๐ Framework Examples
|
|
1076
|
+
- [ ] Nitro-compatible framework integrations
|
|
1077
|
+
- [ ] Nuxt + Pinia Colada example
|
|
1078
|
+
- [ ] StackBlitz playground demos
|
|
1079
|
+
|
|
1080
|
+
### ๐งน Code Quality
|
|
1081
|
+
- [ ] Performance benchmarks
|
|
1082
|
+
- [ ] Bundle size optimization
|
|
1083
|
+
- [ ] Testing utilities
|
|
1084
|
+
- [ ] Error handling patterns
|
|
1085
|
+
|
|
1086
|
+
### ๐ Documentation
|
|
1087
|
+
- [ ] Video tutorials
|
|
1088
|
+
- [ ] Migration guides
|
|
1089
|
+
- [ ] Best practices guide
|
|
1090
|
+
|
|
1091
|
+
### ๐ง Developer Tools
|
|
1092
|
+
- [ ] VS Code extension
|
|
1093
|
+
- [ ] CLI tools
|
|
1094
|
+
- [ ] Debug utilities
|
|
1095
|
+
|
|
1096
|
+
### ๐ Integrations
|
|
1097
|
+
- [ ] Database adapters (Prisma, Drizzle)
|
|
1098
|
+
- [ ] Cache strategies
|
|
1099
|
+
- [ ] Deployment guides
|
|
1100
|
+
|
|
1101
|
+
> [!NOTE]
|
|
1102
|
+
> Have other ideas? Open an issue to discuss!
|
|
1103
|
+
|
|
1104
|
+
## ๐ ๏ธ VS Code Extensions
|
|
1105
|
+
|
|
1106
|
+
For the best development experience with GraphQL, install these recommended VS Code extensions:
|
|
1107
|
+
|
|
1108
|
+
- **[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
|
|
1109
|
+
- **[GraphQL: Syntax Highlighting](https://marketplace.visualstudio.com/items?itemName=GraphQL.vscode-graphql-syntax)** - Adds syntax highlighting for GraphQL queries, mutations, subscriptions, and schema files
|
|
1110
|
+
|
|
1111
|
+
These extensions will enable:
|
|
1112
|
+
- ๐จ Syntax highlighting for `.graphql` files
|
|
1113
|
+
- ๐ IntelliSense and autocompletion based on your schema
|
|
1114
|
+
- โ
Real-time validation of GraphQL queries
|
|
1115
|
+
- ๐ Go-to definition for types and fields
|
|
1116
|
+
- ๐ก Hover information for GraphQL elements
|
|
1117
|
+
|
|
1010
1118
|
---
|
|
1011
1119
|
|
|
1012
1120
|
### ๐ Thank You
|
package/dist/ecosystem/nuxt.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as _nuxt_schema1 from "@nuxt/schema";
|
|
2
2
|
|
|
3
3
|
//#region src/ecosystem/nuxt.d.ts
|
|
4
4
|
interface ModuleOptions {}
|
|
5
|
-
declare const _default:
|
|
5
|
+
declare const _default: _nuxt_schema1.NuxtModule<ModuleOptions, ModuleOptions, false>;
|
|
6
6
|
//#endregion
|
|
7
7
|
export { ModuleOptions, _default as default };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { StandardSchemaV1 } from "./types/standard-schema.js";
|
|
2
2
|
import { CodegenClientConfig, CodegenServerConfig, GenImport, NitroGraphQLOptions } from "./types/index.js";
|
|
3
|
-
import * as
|
|
3
|
+
import * as nitropack0 from "nitropack";
|
|
4
4
|
|
|
5
5
|
//#region src/index.d.ts
|
|
6
6
|
type GraphQLFramework = 'graphql-yoga';
|
|
7
|
-
declare const _default:
|
|
7
|
+
declare const _default: nitropack0.NitroModule;
|
|
8
8
|
//#endregion
|
|
9
9
|
export { CodegenClientConfig, CodegenServerConfig, GenImport, GraphQLFramework, NitroGraphQLOptions, StandardSchemaV1, _default as default };
|
package/dist/index.js
CHANGED
|
@@ -128,7 +128,7 @@ var src_default = defineNitroModule({
|
|
|
128
128
|
return void 0;
|
|
129
129
|
};
|
|
130
130
|
rollupConfig$1.output.chunkFileNames = (chunkInfo) => {
|
|
131
|
-
if (chunkInfo.moduleIds && chunkInfo.moduleIds.some((id) => id.
|
|
131
|
+
if (chunkInfo.moduleIds && chunkInfo.moduleIds.some((id) => id.endsWith(".graphql") || id.endsWith(".resolver.ts") || id.endsWith(".gql"))) return `chunks/graphql/[name].mjs`;
|
|
132
132
|
if (typeof chunkFiles === "function") return chunkFiles(chunkInfo);
|
|
133
133
|
return `chunks/_/[name].mjs`;
|
|
134
134
|
};
|
package/dist/rollup.js
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { getImportId, scanGraphql } from "./utils/index.js";
|
|
2
2
|
import { serverTypeGeneration } from "./utils/server-type-generation.js";
|
|
3
|
+
import { resolve } from "pathe";
|
|
3
4
|
import { readFile } from "node:fs/promises";
|
|
4
5
|
import { parse } from "graphql";
|
|
5
6
|
import { genImport } from "knitwork";
|
|
@@ -8,6 +9,7 @@ import { genImport } from "knitwork";
|
|
|
8
9
|
async function rollupConfig(app) {
|
|
9
10
|
virtualDefs(app);
|
|
10
11
|
virtualResolvers(app);
|
|
12
|
+
getGraphQLConfig(app);
|
|
11
13
|
app.hooks.hook("rollup:before", (nitro, rollupConfig$1) => {
|
|
12
14
|
rollupConfig$1.plugins = rollupConfig$1.plugins || [];
|
|
13
15
|
const { include = /\.(graphql|gql)$/i, exclude, validate = false } = app.options.graphql?.loader || {};
|
|
@@ -82,6 +84,16 @@ function virtualResolvers(app) {
|
|
|
82
84
|
return code;
|
|
83
85
|
};
|
|
84
86
|
}
|
|
87
|
+
function getGraphQLConfig(app) {
|
|
88
|
+
const configPath = resolve(app.graphql.serverDir, "config.ts");
|
|
89
|
+
app.options.virtual ??= {};
|
|
90
|
+
app.options.virtual["#nitro-internal-virtual/graphql-config"] = () => {
|
|
91
|
+
return `import config from '${configPath}'
|
|
92
|
+
const importedConfig = config
|
|
93
|
+
export { importedConfig }
|
|
94
|
+
`;
|
|
95
|
+
};
|
|
96
|
+
}
|
|
85
97
|
|
|
86
98
|
//#endregion
|
|
87
99
|
export { rollupConfig };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as h32 from "h3";
|
|
2
2
|
|
|
3
3
|
//#region src/routes/apollo-server.d.ts
|
|
4
|
-
declare const _default:
|
|
4
|
+
declare const _default: h32.EventHandler<h32.EventHandlerRequest, any>;
|
|
5
5
|
//#endregion
|
|
6
6
|
export { _default as default };
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import { startServerAndCreateH3Handler } from "../utils/apollo.js";
|
|
2
|
+
import defu from "defu";
|
|
2
3
|
import { mergeResolvers, mergeTypeDefs } from "@graphql-tools/merge";
|
|
4
|
+
import { importedConfig } from "#nitro-internal-virtual/graphql-config";
|
|
3
5
|
import { defs } from "#nitro-internal-virtual/server-defs";
|
|
4
6
|
import { resolvers } from "#nitro-internal-virtual/server-resolvers";
|
|
5
7
|
import { ApolloServer } from "@apollo/server";
|
|
@@ -24,12 +26,12 @@ let apolloServer;
|
|
|
24
26
|
function createApolloServer() {
|
|
25
27
|
if (!apolloServer) {
|
|
26
28
|
const { typeDefs, resolvers: mergedResolvers } = createMergedSchema();
|
|
27
|
-
apolloServer = new ApolloServer({
|
|
29
|
+
apolloServer = new ApolloServer(defu({
|
|
28
30
|
typeDefs,
|
|
29
31
|
resolvers: mergedResolvers,
|
|
30
32
|
introspection: true,
|
|
31
33
|
plugins: [ApolloServerPluginLandingPageLocalDefault({ embed: true })]
|
|
32
|
-
});
|
|
34
|
+
}, importedConfig));
|
|
33
35
|
}
|
|
34
36
|
return apolloServer;
|
|
35
37
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as h34 from "h3";
|
|
2
2
|
|
|
3
3
|
//#region src/routes/graphql-yoga.d.ts
|
|
4
|
-
declare const _default:
|
|
4
|
+
declare const _default: h34.EventHandler<h34.EventHandlerRequest, Promise<Response>>;
|
|
5
5
|
//#endregion
|
|
6
6
|
export { _default as default };
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
+
import defu from "defu";
|
|
1
2
|
import { mergeResolvers, mergeTypeDefs } from "@graphql-tools/merge";
|
|
3
|
+
import { importedConfig } from "#nitro-internal-virtual/graphql-config";
|
|
2
4
|
import { defs } from "#nitro-internal-virtual/server-defs";
|
|
3
5
|
import { resolvers } from "#nitro-internal-virtual/server-resolvers";
|
|
4
6
|
import { defineEventHandler, toWebRequest } from "h3";
|
|
@@ -40,12 +42,12 @@ let yoga;
|
|
|
40
42
|
var graphql_yoga_default = defineEventHandler(async (event) => {
|
|
41
43
|
if (!yoga) {
|
|
42
44
|
const schema = createMergedSchema();
|
|
43
|
-
yoga = createYoga({
|
|
45
|
+
yoga = createYoga(defu({
|
|
44
46
|
schema,
|
|
45
47
|
graphqlEndpoint: "/api/graphql",
|
|
46
48
|
landingPage: false,
|
|
47
49
|
renderGraphiQL: () => apolloSandboxHtml
|
|
48
|
-
});
|
|
50
|
+
}, importedConfig));
|
|
49
51
|
}
|
|
50
52
|
const request = toWebRequest(event);
|
|
51
53
|
const response = await yoga.handleRequest(request, event);
|
package/dist/routes/health.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import * as
|
|
1
|
+
import * as h36 from "h3";
|
|
2
2
|
|
|
3
3
|
//#region src/routes/health.d.ts
|
|
4
|
-
declare const _default:
|
|
4
|
+
declare const _default: h36.EventHandler<h36.EventHandlerRequest, Promise<{
|
|
5
5
|
status: string;
|
|
6
6
|
message: string;
|
|
7
7
|
timestamp: string;
|