{"id":21589833,"url":"https://github.com/frontendr/babel-plugin-transform-compress-graphql","last_synced_at":"2025-04-10T21:55:47.716Z","repository":{"id":56387443,"uuid":"170913859","full_name":"frontendr/babel-plugin-transform-compress-graphql","owner":"frontendr","description":"A Babel plugin which compresses / minifies tagged template literals containing a GraphQL query.","archived":false,"fork":false,"pushed_at":"2020-11-19T11:24:32.000Z","size":50,"stargazers_count":6,"open_issues_count":1,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-03-24T19:11:59.017Z","etag":null,"topics":["babel","babel-plugin","graphql","minification"],"latest_commit_sha":null,"homepage":"https://www.npmjs.com/package/babel-plugin-transform-compress-graphql","language":"JavaScript","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/frontendr.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2019-02-15T18:59:58.000Z","updated_at":"2021-10-18T08:52:18.000Z","dependencies_parsed_at":"2022-08-15T17:50:23.743Z","dependency_job_id":null,"html_url":"https://github.com/frontendr/babel-plugin-transform-compress-graphql","commit_stats":null,"previous_names":[],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frontendr%2Fbabel-plugin-transform-compress-graphql","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frontendr%2Fbabel-plugin-transform-compress-graphql/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frontendr%2Fbabel-plugin-transform-compress-graphql/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/frontendr%2Fbabel-plugin-transform-compress-graphql/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/frontendr","download_url":"https://codeload.github.com/frontendr/babel-plugin-transform-compress-graphql/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248198879,"owners_count":21063627,"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":["babel","babel-plugin","graphql","minification"],"created_at":"2024-11-24T16:15:55.065Z","updated_at":"2025-04-10T21:55:47.692Z","avatar_url":"https://github.com/frontendr.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# babel-plugin-transform-compress-graphql\n\n\u003e Removes unnecessary white space from GraphQL queries using\n\u003e [`graphql-query-compress`](https://www.npmjs.com/package/graphql-query-compress).\n\n[![npm version](https://img.shields.io/npm/v/babel-plugin-transform-compress-graphql.svg)](https://www.npmjs.com/package/babel-plugin-transform-compress-graphql)\n[![npm downloads](https://img.shields.io/npm/dm/babel-plugin-transform-compress-graphql.svg)](https://www.npmjs.com/package/babel-plugin-transform-compress-graphql)\n[![Build Status](https://travis-ci.org/frontendr/babel-plugin-transform-compress-graphql.svg?branch=master)](https://travis-ci.org/frontendr/babel-plugin-transform-compress-graphql)\n[![Coverage Status](https://coveralls.io/repos/github/frontendr/babel-plugin-transform-compress-graphql/badge.svg?branch=develop)](https://coveralls.io/github/frontendr/babel-plugin-transform-compress-graphql?branch=develop)\n\n[![Dependencies](https://img.shields.io/david/frontendr/babel-plugin-transform-compress-graphql.svg)](https://david-dm.org/frontendr/babel-plugin-transform-compress-graphql)\n[![DevDependencies](https://img.shields.io/david/dev/frontendr/babel-plugin-transform-compress-graphql.svg)](https://david-dm.org/frontendr/babel-plugin-transform-compress-graphql?type=dev)\n\n## Installation\n\n```sh\nnpm install --save-dev babel-plugin-transform-compress-graphql\n```\n\n## The problem solved\n\nCompress GraphQL queries by simply adding a `/* GraphQL */` comment or tagging them with\nthe `gql` template tag. The tag name or comment text can be customized with an option.\n\n## Example\n\n### Using the template tag\n\n**In**\n\n```js\nconst query = gql`\n  people(uuid:\"${uuid}\") {\n    uuid,\n    fullName,\n    dateOfBirth,\n    nextBirthday,\n    age,\n    relations {\n      description,\n      type,\n      person {\n        uuid,\n        fullName\n      }\n    }\n    events {\n      uuid,\n      name,\n      description,\n      startDate, startTime,\n      endDate, endTime\n    }\n  }`;\n```\n\nWhich is pretty big literal right?\n\n**Out**\n\n```js\nconst query = `people(uuid:\"${uuid}\"){uuid,fullName,dateOfBirth,nextBirthday,age,relations{description,type,person{uuid,fullName}}events{uuid,name,description,startDate,startTime,endDate,endTime}}`;\n```\n\nWhich saves quite some white space which has no use in production builds.\n\n### Using a comment\n\nSince `1.3.0` it's possible to use a comment to mark a template literals as a GraphQL query.\n\n```js\nconst query = /* GraphQL */ `\n  people {\n    fullName,\n    age\n  }\n`;\n```\n\nThe value of the comment can be changed using the `comment` option. The comment is being\nmatched in a case-insensitive manner so `/* graphql */` is also fine.\n\n**Important:** The comment _only_ works with template literals. Normal strings will not\nbe compressed.\n\n## Usage\n\n### Via `.babelrc` / `babel.config.js` (Recommended)\n\n**.babelrc**\n\n```json\n{\n  \"env\": {\n    \"production\": {\n      \"plugins\": [\"transform-compress-graphql\"]\n    }\n  }\n}\n```\n\n### Via CLI\n\n```sh\nbabel --plugins transform-compress-graphql script.js\n```\n\n### Via Node API\n\n```js\nrequire(\"@babel/core\").transform(\"code\", {\n  plugins: [\"transform-compress-graphql\"],\n});\n```\n\n## Plugin options\n\nOptions can be passed by wrapping the plugin name in an array and adding an\nobject literal as the second item in that array.\n\nFor example in your **.babelrc**:\n\n```json\n{\n  \"env\": {\n    \"production\": {\n      \"plugins\": [\n        [\n          \"transform-compress-graphql\",\n          {\n            \"tagName\": \"gql\",\n            \"tagFunction\": \"\",\n            \"comment\": \"graphql\",\n            \"removeComments\": true\n          }\n        ]\n      ]\n    }\n  }\n}\n```\n\nThe following options are available:\n\n- `tagName` - `String` with the name of the tag to search for. Defaults\n  to `\"gql\"`.\n- `tagFunction` - `String` with the name of the tag to replace the tag with.\n  Defaults to: `\"\"` which means the tag will be removed from the output.\n- `removeComments` - `Boolean` when set to `false` will leave any matched comments in\n  place. Defaults to `true`.\n- `comment` - `String` with the case-insensitive text matched in any leading comments\n  for a template literal. The entire string will be expected. Defaults to `\"graphql\"`.\n\n## What about existing variables named `gql`?\n\nFor template literals with a tag named `gql` (or with the same name as the `tagName`\noption) the scope will be checked for an existing binding of that variable and will not\nbe replaced with `tagFunction` if it exists.\n\n## Compression\n\nGraphQL literals will be compressed with [`graphql-query-compress`](https://www.npmjs.com/package/graphql-query-compress).\nAny issues related to the compressed query result should be posted as an issue in the\n[issue tracker](https://github.com/rse/graphql-query-compress/issues) of that package.\n\n## License\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrontendr%2Fbabel-plugin-transform-compress-graphql","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffrontendr%2Fbabel-plugin-transform-compress-graphql","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffrontendr%2Fbabel-plugin-transform-compress-graphql/lists"}