gqlimp

Gqlimp is an executable npm package created for client applications that communicate with the graphql server. The reasons to create this tool are to accelerate development of server applications coded with graphql in the client part and to increase client - server interaction.

It is intended that the query scheme created on the graphql server can be used easily and accurately in the client application via Gqlimp.Thanks to perform programmatic processing when creating a query, it can be developped code more flexible and faster in client side.

When there is a change in the query scheme created on the server, the client will be aware of this change and will have to make the necessary arrangements thanks to the import mechanism.

Installation

$ npm install gqlimp

Features

Parameters Guide

• url: Graphql server url (required).
• fileName: Name of imported file (default: "schema-all").
• generate: To create a schema client file (optional).
• verbose: To view details of schema types (optional).
• output: Folder path of output (default: "output").
• properties: To import chosen specific properties (default: "all" - options: "enums", "interfaces", "inputs", "customScalars", "helpers", "args").
• type: File type of output (default: "ts" - options: for javascript -> "js", for typescript -> "ts").
• realType: To add real field types (default: false)
• compileTarget: It is used when type parameter is "js" (default: "es5" - options: "es5", "es6", "es2016", "es2017", "esnext" ).
• compileLib: It is used when type parameter is "js" (default: "esnext" - options: "es5", "es6", "es2016", "es2017", "esnext" ).

Generated File Properties

There are 2 basic public classes in the file created with gqlimp. Depending on the type of query to be used, one of the following classes is selected as root and the structure of the query is created.

• QueryObject Class
  • Properties
    • query: string
    • args: any
• MutationObject Class
  • Properties

    • query: string

    • args: any

How to work "gqlimp" tool?

Example of Gqlimp tool:   Gqlimp requires a graphql server to create the client file.

Step - 1: You need a graphql server. (sample url -> http://localhost:5000/api)

  type Phone {
    gsm: String
    note: String
  }

  type User {
    id: Int
    name: String  
    phone: Phone       
  }
  
  type Query {    
    user(id: Int!): User     
  }
  
  input PhoneInput {
    gsm: String
    note: String
  }  
  
  input UserInput {
    name: String  
    phone: PhoneInput    
  } 
  
  type Mutation {
    createUser(user: UserInput): User
  }    
  

Let's assume that the Graphql server contains inputs and types in step-1. To import these schema types using the Gqlimp tool, the command in step-2 must be executed.

Step - 2: Execute command:

$ gqlimp --url http://localhost:5000/api -g

After running the command, the client file is created in the output folder.

Step - 3: File view generated by "gqlimp" (schema-all.ts).

  export interface Phone_intf {
    gsm? : boolean | number;
    note? : boolean | number;
  }

  export interface User_intf {
    id? : boolean | number;
    name? : boolean | number;
    phone? : User_phone;	
  } 

  export interface Query_intf {
    user? : Query_user;
  }
  
  export interface Mutation_intf {
    createUser? : Mutation_createUser;
  }
  
  /*
  export class QueryObject ...
  
  export class MutationObject ...
  
  export class Query_user ...
  
  export class User_phone ...
  
  export class Mutation_createUser ...
  */

The structure of the generated file is like the structure of the fields on the graphql server. Gqlimp has created a class for each field.

Step - 4: Usage of client "schema-all.ts" file

Query Example:

  import { QueryObject } from './schema-all';
    
  const qo = new QueryObject({
    user: new Query_user({
      id: true,
      name: true,
      phone: new User_phone({
        gsm: true,
        note: true
      })  
    })
  });
  
  console.log(qo.query);
  /* Output
  query {
    user {
      id
      name
      phone {
        gsm
        note
      }
    }
  }
  */

Mutation Example:

  import { QueryObject } from './schema-types';
    
  const qo = new MutationObject({
    createUser: new Mutation_createUser({     
      name: 'User 1',
      phone: {
        gsm: 'User Gsm',
        note: 'Note'
      }  
    },
    {
      id: true,
      name: true      
    })
  });
  
  console.log(qo.query);
  /* Output
    mutation ($name: String, $phone: PhoneInput) {
      createUser(name: $name, phone: $phone ) {
        id
        name
      }
    }
  
  console.log(qo.args);
  /* Output
    {
      name: 'User 1',
      phone: {
        gsm: 'User Gsm',
        note: 'Note'
      }
    }
  */

In above examples, QueryObject class starts as root. This root object gives fields that can be queried.

These fields expect the object of their class. After defining the fields to be used, The QueryObject.query / MutationObject.query property gives a string query. If there is an argument in the generated query these arguments are accessed with QueryObject.args / MutationObject.args.

Node Compatibility

• node >= 6.x;

License

MIT