condense-graphql.macro

Remove unnecessary whitespace characters from graphql queries, mutations, etc at compile time.

Demo - Thanks to astexplorer.net!

• About
• Install
• Usage
  • Caveats
• Contributing
• License

About

This is a babel macro that takes a well-formatted (albeit verbose) graphql query string and removes all unnecessary whitespace.

That allows you to build well-formatted graphql queries, even run a formatter against them, during development, and at (compile) build time, remove all unnecessary whitespace resulting in a much smaller memory footprint.

Install

npm install --save-dev condense-graphql.macro

Usage

// import the macro
import condenseGraphql from "condense-graphql.macro";
 
// Wrap you query with the macro
const query = condenseGraphql(`
    query {
        myQuery {
            options
        }
    }
`);

When compiled, the above code will be condensed into a much smaller query string.

const query = `query{simpleQuery{options}}`;

Notice the import statement and wrapping condenseGraphql are automatically removed!

Dynamic Queries

This works the same for queries that accept template expressions as well:

import condenseGraphql from "condense-graphql.macro";
 
function queryWithVariables(type) {
  return condenseGraphql(`
    query products(
      $type: String,
      $contains: String
    ){
        product(type: $type, contains: $contains) {
            id
            ${type}
            description
        }
    }
    `);
}

Produces:

function queryWithVariables(type) {
  return `query products($type:String,$contains:String){product(type:$type,contains:$contains){id ${type} description}}`;
}

Caveats

The argument to the function must be a single string or template literal argument. Using binary operations or calling concat() won't work. For example:

import condenseGraphql from "condense-graphql.macro";
 
// Fails
condenseGraphql("query" + "getUserData { id name number }");
// Fails
condenseGraphql("query".concat("getUserData { id name number }"));

However, you can work around this by using the preval.macro. For example:

// In this instance the import order matters.
// preval.macro must come before condense-graphql.macro so that it is the first to run.
import preval from "preval.macro";
import condenseGraphql from "condense-graphql.macro";
 
// Works
condenseGraphql(
  preval`module.exports = "query" + "getUserData { id name number }"`
);
// Works
condenseGraphql(
  preval`module.exports = "query".concat("getUserData { id name number }")`
);

Contributing

Help / improvement is appreciated!

Open an issue and/or submit a pull-request.

See DEVELOPMENT.md for help developing this macro.

License

Refer to LICENSE.md.