{"id":13516840,"url":"https://github.com/bustle/graphql-helper","last_synced_at":"2026-03-06T07:31:40.985Z","repository":{"id":57253466,"uuid":"64777404","full_name":"bustle/graphql-helper","owner":"bustle","description":"A simple helper library for constructing GraphQL queries.","archived":false,"fork":false,"pushed_at":"2018-09-08T21:24:40.000Z","size":70,"stargazers_count":24,"open_issues_count":1,"forks_count":1,"subscribers_count":9,"default_branch":"master","last_synced_at":"2026-02-19T17:56:08.141Z","etag":null,"topics":["fragments","graphql","mutations","queries"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bustle.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-08-02T17:25:27.000Z","updated_at":"2021-03-01T02:40:18.000Z","dependencies_parsed_at":"2022-08-31T22:11:45.597Z","dependency_job_id":null,"html_url":"https://github.com/bustle/graphql-helper","commit_stats":null,"previous_names":["bustlelabs/graphql-helper"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/bustle/graphql-helper","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bustle%2Fgraphql-helper","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bustle%2Fgraphql-helper/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bustle%2Fgraphql-helper/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bustle%2Fgraphql-helper/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bustle","download_url":"https://codeload.github.com/bustle/graphql-helper/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bustle%2Fgraphql-helper/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":30165621,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-03-06T04:43:31.446Z","status":"ssl_error","status_checked_at":"2026-03-06T04:40:30.133Z","response_time":250,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"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":["fragments","graphql","mutations","queries"],"created_at":"2024-08-01T05:01:26.427Z","updated_at":"2026-03-06T07:31:40.966Z","avatar_url":"https://github.com/bustle.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# graphql-helper [![Build Status](https://travis-ci.org/bustlelabs/graphql-helper.svg?branch=master)](https://travis-ci.org/bustlelabs/graphql-helper)\n\nA GraphQL helper library for constructing queries and accumulating fragments.\nThis library is meant for statically determined queries, and encourages the use of variables and fragments over string concatenation.\n\nThis library is fairly short and written in a literate style, it is encouraged to take the time to read through the source code.\n\n\n```bash\nyarn add graphql-helper\n```\n\n\n## Example:\n\n```js\nimport { fragment, query } from 'graphql-helper'\nimport fetch from 'isomorphic-fetch'\n\nconst Contributor = fragment('Contributor', 'User') `{\n  name\n  slug\n}`\n\nconst PostPage = fragment('PostPage', 'Post') `{\n  title\n  body\n  contributors {\n    ${Contributor}\n  }\n}`\n\nconst PostQuery = query('PostQuery', { postId: 'ID!' }) `{\n  post(id: $postId) {\n    id\n    ${PostPage}\n  }\n}`\n\n\n// Write your own app-specific dispatcher.\n// In this case, we just have a simple function, but this could live in\n// a react library, an elm effects module, an ember service...\n\nfunction runQuery(op, vars): Promise\u003cResult\u003e {\n  return fetch('http://localhost:3000/graphql', {\n      method: 'POST',\n      headers: {\n        'Content-Type': 'application/json'\n      },\n      body: JSON.stringify({\n        query: op,\n        variables: vars,\n      }),\n    })\n    .then(r =\u003e r.json())\n    .then({ data, errors }) =\u003e errors ? Promise.reject(errors) : Promise.resolve(data))\n   })\n}\n\n\n// Usage\nrunQuery(PostQuery, { postId: 123 })\n  .then(data =\u003e {\n    // data = {\n    //   post: {\n    //     id: 123,\n    //     title: \"foo\",\n    //     body: \"bar\",\n    //     contributors: [\n    //       { name: 'Daria Morgendorffer', slug: '/daria' },\n    //       { name: 'Jane Lane', slug: '/jane' }\n    //     ]\n    //   }\n    // }\n  })\n\n```\n\n\n## Fragments\n\nA fragment represents the data requirements of some component or aspect of an application.\n\nConsider the graphql fragment:\n\n```graphql\nfragment FullPost on Post {\n  id\n  slug\n  title\n  body\n  contributors {\n    ...Contributor\n  }\n  author {\n    name\n    ...Author\n  }\n}\n```\n\nSuppose `Author` and `Contributor` are fragment definitions that we have already defined, then we can define `FullPost` as follows:\n\n```js\nimport { fragment } from 'graphql-helper'\nimport { Author, Contributor } from 'some-module'\n\nconst FullPost = fragment('FullPost', 'Post') `{\n  id\n  slug\n  title\n  body\n  contributors {\n    ${Contributor}\n  }\n  author {\n    name\n    ${Author}\n  }\n}`\n```\n\n\n## Queries\n\nA query represents some operation that fetches data.\n\nConsider the GraphQL query:\n\n```graphql\nquery GetPost($id: ID!) {\n  post(id: $id) {\n    __typename\n    id\n    ...FullPost\n  }\n}\n```\n\nSuppose `FullPost` is already defined above. Then we can define this query as follows:\n\n```js\nconst GetPost = query('GetPost', { id: 'ID!' }) `{\n  post(id: $id) {\n    __typename\n    id\n    ${FullPost}\n  }\n}`\n```\n\nAnd we can open up the resulting query object yields the following:\n\n```js\nGetPost.__GRAPHQL_QUERY__\n// =\u003e true\n\nGetPost.name\n// =\u003e 'GetPost'\n\nGetPost.definition\n// =\u003e `query GetPost($id: ID!) {\n  post(id: $id) {\n    __typename\n    id\n    ...FullPost\n  }\n}`\n\nGetPost.fragments\n// =\u003e { FullPost, Author, Contributor }\n\n// the following are equivalent:\nGetPost.definition\nGetPost.toString()\n// =\u003e `query GetPost($id: ID!) {\n  post(id: $id) {\n    __typename\n    id\n    ...FullPost\n  }\n}\n\nfragment FullPost on Post {\n  id\n  slug\n  id\n  slug\n  title\n  body\n  contributors {\n    ...Contributor\n  }\n  author {\n    name\n    ...Author\n  }\n}\n\nfragment Contributor on User {\n  ...etc\n`\n```\n\n\n## Mutations\n\nA mutation represents some operation which changes data.\n\nConsider a relay-compatible mutation `createPost`:\n\n```graphql\ntype RootMutation {\n  ...\n  createPost(input: CreatePostInput): CreatePostPayload\n  ...\n}\n\ninput CreatePostInput {\n  clientMutationId: String!\n  title: String!\n  body: String!\n}\n\ntype CreatePostPayload {\n  clientMutationId: String!\n  post: Post!\n}\n\n```\n\nThen there exists a natural, \"free mutation\" that performs just that mutation:\n\n```graphql\nmutation CreatePost($input: CreatePostInput) {\n  payload: createPost(input: $Input) {\n    # application decides which fields to fetch\n    clientMutationId\n    post {\n      ...FullPost\n    }\n  }\n}\n```\n\nNoting that the `clientMutationId` is a special field, we provide a condensed syntax for such a query as follows:\n\n```js\nconst CreatePost = GraphQL.mutation('createPost', {\n  title: 'String!',\n  body: 'String!',\n}) `{\n  clientMutationId\n  post {\n    ${FullPost}\n  }\n}`\n```\n\nAnd we can open up the resulting query object yields the following:\n\n```js\nCreatePost.__GRAPHQL_MUTATION__\n// =\u003e true\n\nCreatePost.name\n// =\u003e 'CreatePost'\n\nCreatePost.definition\n// =\u003e `mutation CreatePost($input: CreatePostInput!) {\n  payload: createPost(input: $input) {\n    clientMutationId\n    post {\n      ...FullPost\n    }\n  }\n}`\n\nCreatePost.fragments\n// =\u003e { FullPost, Author, Contributor }\n\n// the following are equivalent:\nCreatePost.definition\nCreatePost.toString()\n// =\u003e `mutation CreatePost($input: CreatePostInput!) {\n  payload: createPost(input: $input) {\n    clientMutationId\n    post {\n      ...FullPost\n    }\n  }\n}\n\nfragment FullPost on Post {\n  id\n  slug\n  id\n  slug\n  title\n  body\n  contributors {\n    ...Contributor\n  }\n  author {\n    name\n    ...Author\n  }\n}\n\nfragment Contributor on User {\n  ...etc\n`\n```\n\n\n## Document\n\nThe `GraphQL.document([ QueryOne, QueryTwo, MutationOne, ... ])` method generates a complete document object which is useful for persisted queries.\nThis should never appear in your application logic, although build tools may use this to heavily optimize a production build by persisting a document at build time.\n\nSee source code for type declaration and implementation.\n\n## TODO\n- Support for static analysis and pre-compilation of queries\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbustle%2Fgraphql-helper","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbustle%2Fgraphql-helper","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbustle%2Fgraphql-helper/lists"}