{"id":16266256,"url":"https://github.com/dulnan/nuxt-graphql-middleware","last_synced_at":"2026-01-05T14:25:01.051Z","repository":{"id":45969416,"uuid":"335192307","full_name":"dulnan/nuxt-graphql-middleware","owner":"dulnan","description":"GraphQL in the backend, fetch in the frontend. With TypeScript support.","archived":false,"fork":false,"pushed_at":"2025-03-28T12:35:08.000Z","size":6544,"stargazers_count":62,"open_issues_count":2,"forks_count":10,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-04-01T16:02:44.015Z","etag":null,"topics":["graphql","nuxt-module","nuxtjs","typescript"],"latest_commit_sha":null,"homepage":"https://nuxt-graphql-middleware.dulnan.net","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/dulnan.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-02-02T06:33:33.000Z","updated_at":"2025-03-24T14:09:22.000Z","dependencies_parsed_at":"2024-01-23T13:30:14.366Z","dependency_job_id":"83420359-bc9f-44ce-9158-29e9f7e4e561","html_url":"https://github.com/dulnan/nuxt-graphql-middleware","commit_stats":{"total_commits":205,"total_committers":10,"mean_commits":20.5,"dds":"0.19512195121951215","last_synced_commit":"4e79df1d9affaf6d0ca573ab875ed472f1ee7279"},"previous_names":[],"tags_count":15,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dulnan%2Fnuxt-graphql-middleware","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dulnan%2Fnuxt-graphql-middleware/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dulnan%2Fnuxt-graphql-middleware/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/dulnan%2Fnuxt-graphql-middleware/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/dulnan","download_url":"https://codeload.github.com/dulnan/nuxt-graphql-middleware/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247261603,"owners_count":20910108,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["graphql","nuxt-module","nuxtjs","typescript"],"created_at":"2024-10-10T17:40:27.573Z","updated_at":"2026-01-05T14:25:01.046Z","avatar_url":"https://github.com/dulnan.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"![nuxt-graphql-middleware banner](docs/banner.png?raw=true 'Nuxt GraphQL Middleware - Expose queries and mutations as fully typed API routes.')\n\n# nuxt-graphql-middleware\n\nA GraphQL client for Nuxt 3.\n\n**[Documentation](https://nuxt-graphql-middleware.dulnan.net)** –\n**[npm](https://www.npmjs.com/package/nuxt-graphql-middleware)** –\n**[Version 2.x (for Nuxt 2)](https://github.com/dulnan/nuxt-graphql-middleware/tree/2.x)**\n\n[![Test](https://github.com/dulnan/nuxt-graphql-middleware/actions/workflows/node.js.yml/badge.svg?branch=main)](https://github.com/dulnan/nuxt-graphql-middleware/actions/workflows/node.js.yml)\n\n## Features\n\n- Exposes each query and mutation as an **API route**\n- GraphQL requests are done **only on the server side**\n- Includes **composables** to perform queries or mutations\n- **No GraphQL documents** in client bundle\n- Super fast **TypeScript code generation** using\n  **[graphql-typescript-deluxe](https://github.com/dulnan/graphql-typescript-deluxe)**\n- **HMR** for all GraphQL files\n- **[MCP integration](https://nuxt-graphql-middleware.dulnan.net/features/mcp)**\n  to expose schema and operations to AI assistants\n- Optional **Client side caching** for query operations\n- Modify **request headers**, responses and handle errors\n- Integration with **[Nuxt DevTools](https://devtools.nuxtjs.org)**\n\n## Setup\n\n### Install\n\n```bash\nnpx nuxi@latest module add nuxt-graphql-middleware\n```\n\nMinimal configuration needed:\n\n```javascript\nexport default defineNuxtConfig({\n  modules: ['nuxt-graphql-middleware'],\n  graphqlMiddleware: {\n    graphqlEndpoint: 'https://example.com/graphql',\n  },\n})\n```\n\nSee\n[all configuration options](https://nuxt-graphql-middleware.dulnan.net/configuration/module)\n\n## Usage\n\nWrite your first query, e.g. in pages/films.query.graphql:\n\n```graphql\nquery films {\n  allFilms {\n    films {\n      id\n    }\n  }\n}\n```\n\nYour query is now available via the useGraphqlQuery() composable:\n\n```typescript\nconst { data, errors } = await useGraphqlQuery('films')\nconsole.log(data.allFilms.films)\n```\n\nOr using the convenience wrapper for useAsyncData:\n\n```typescript\nconst { data } = await useAsyncGraphqlQuery('films')\nconsole.log(data.value.allFilms.films)\n```\n\nAlternatively you can also directly call the API route to get the same result:\n\n```typescript\nconst response = await $fetch('/api/graphql_middleware/query/films')\n```\n\nOr using `useFetch`:\n\n```typescript\nconst { data } = await useFetch('/api/graphql_middleware/query/films')\n```\n\n## Nuxt 2\n\nThe 3.x releases are only compatible with Nuxt 3. The\n[2.x branch](https://github.com/dulnan/nuxt-graphql-middleware/tree/2.x) and\nreleases on npm are compatible with Nuxt 2. However this version is not\nmaintained anymore.\n\n## Development\n\nThe module uses the default Nuxt module authoring setup where the module itself\nis located in `./src`, with a playground located in `./playground/`.\n\n### Setup\n\n#### Install dependencies\n\nInstall the dependencies of the module and playground:\n\n```sh\nnpm install\n```\n\n#### Prepare Types\n\nThis will generate all the types needed to start developing:\n\n```sh\nnpm run dev:prepare\n```\n\n#### Start Apollo Server\n\nThe playground uses an Apollo server that needs to be built separately.\n\n```sh\ncd apollo\nnpm install\nnpm run compile\nnpm run start\n```\n\n### Start the Playground\n\n```sh\nnpm run dev\n```\n\nYou can now open http://localhost:3000 to start developing.\n\n### Testing\n\n#### Lint / Code Style\n\n```sh\nnpm run lint\nnpm run prettier\n```\n\n#### Unit Tests (Vitest)\n\nUnit tests are done using Vitest.\n\n```sh\nnpm run test:ci\n```\n\n#### E2E (Cypress)\n\nWe use Cypress to run some E2E tests. The tests are executed against the\nplayground **build**:\n\n```sh\nnpm run dev:build\nnpm run dev:start\nnpm run cypress\n```\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdulnan%2Fnuxt-graphql-middleware","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdulnan%2Fnuxt-graphql-middleware","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdulnan%2Fnuxt-graphql-middleware/lists"}