feat: Nuxt 4 compatibility (#40)

* feat: change graphqlMiddleware.serverOptions path (#37)

This makes it compatible with Nuxt 4

* update dev dependencies, tsconfig files

* create new folder structure in playground

* Nuxt 4 compatible templates and path resolving

* fix dev:prepare in module

* fix tests

* Use rootDir resolver, fix TS

* Default to <serverDir> for server options file

.graphqlrc.yml

@@ -1,6 +1,6 @@
 schema: './playground/schema.graphql'
 documents:
-  - './playground/pages/**/*.graphql'
-  - './playground/components/**/*.graphql'
-  - './playground/composables/**/*.graphql'
-  - './playground/plugins/**/*.graphql'
+  - './playground/app/pages/**/*.graphql'
+  - './playground/app/components/**/*.graphql'
+  - './playground/app/composables/**/*.graphql'
+  - './playground/app/plugins/**/*.graphql'

.prettierignore

@@ -0,0 +1 @@
+playground/schema.graphql

client/pages/index.vue

@@ -58,6 +58,7 @@
 </template>
 
 <script setup lang="ts">
+import { ref, computed } from '#imports'
 import { onDevtoolsClientConnected } from '@nuxt/devtools-kit/iframe-client'
 import MiniSearch from 'minisearch'
 

docs/configuration/full-example.md

@@ -120,7 +120,7 @@ export default defineNuxtConfig({
 })
 ```
 
-## Full ~/app/graphqlMiddleware.serverOptions.ts example
+## Full ~/server/graphqlMiddleware.serverOptions.ts example
 
 ```typescript
 import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware/dist/runtime/serverOptions'

docs/configuration/server-options.md

@@ -2,15 +2,16 @@
 
 All dynamic configuration that deals with the server-side requests made to the
 GraphQL server is located in a special runtime file located at
-`~/app/graphqlMiddleware.serverOptions.ts`. This file is bundled together with
-the nitro build in the .output folder.
+`~/server/graphqlMiddleware.serverOptions.ts`. This file is bundled together
+with the nitro build in the .output folder.
 
-Create a file called `graphqlMiddleware.serverOptions.ts` (or js/mjs) inside the
-`app` folder in your Nuxt root.
+Create a file called `graphqlMiddleware.serverOptions.ts` inside the `serverDir`
+of your Nuxt project. If you didn't specifically override this in your Nuxt
+config this will be `./server`.
 
 ::: code-group
 
-```typescript [~/app/graphqlMiddleware.serverOptions.ts]
+```typescript [~/server/graphqlMiddleware.serverOptions.ts]
 import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware/dist/runtime/serverOptions'
 
 export default defineGraphqlServerOptions({

docs/configuration/using-auth-headers.md

@@ -31,7 +31,7 @@ export default defineNuxtConfig({
 ## For query/mutation requests at runtime
 
 Define a `serverFetchOptions` callback in
-`~/app/graphqlMiddleware.serverOptions.ts`. This method is called before a
+`~/server/graphqlMiddleware.serverOptions.ts`. This method is called before a
 GraphQL request is made.
 
 ```typescript