• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    迪恩网络公众号

leoasis/graphql-tag.macro: Babel Macro for graphql-tag

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称(OpenSource Name):

leoasis/graphql-tag.macro

开源软件地址(OpenSource Url):

https://github.com/leoasis/graphql-tag.macro

开源编程语言(OpenSource Language):

JavaScript 100.0%

开源软件介绍(OpenSource Introduction):

graphql-tag.macro

Babel Macro for the graphql-tag library.

What it does

It inlines the result of parsing the GraphQL queries with graphql-tag.

Converts this:

const query = gql`
  query {
    hello {
      world
    }
  }
`;

To this:

const query = {
  'kind': 'Document',
  'definitions': [{
    'kind': 'OperationDefinition',
    'operation': 'query',
    'variableDefinitions': [],
    'directives': [],
    'selectionSet': {
      'kind': 'SelectionSet',
      'selections': [{
        'kind': 'Field',
        'alias': null,
        'name': {
          'kind': 'Name',
          'value': 'hello'
        },
        'arguments': [],
        'directives': [],
        'selectionSet': {
          'kind': 'SelectionSet',
          'selections': [{
            'kind': 'Field',
            'alias': null,
            'name': {
              'kind': 'Name',
              'value': 'world'
            },
            'arguments': [],
            'directives': [],
            'selectionSet': null
          }]
        }
      }]
    }
  }],
  'loc': {
    'start': 0,
    'end': 45,
    'source': {
      'body': '\\\\n  query {\\\\n    hello {\\\\n      world\\\\n    }\\\\n  }\\\\n',
      'name': 'GraphQL request',
      'locationOffset': {
        'line': 1,
        'column': 1
      }
    }
  }
};

It also supports adding interpolated fragments:

const frag = gql`
  fragment Frag on Hello {
    world
  }
`;

const query = gql`
  query {
    hello {
      universe
      ...Frag
    }
  }

  ${frag}
`;

Why

To avoid the runtime overhead of parsing a string into a GraphQL AST.

Installation and setup

Install and configure babel-macros if you haven't already.

Then install this package:

# with yarn
yarn add -D graphql-tag.macro

# with npm
npm install -D graphql-tag.macro

Usage

The usage is the same as using graphql-tag directly, the only difference is that you have to import gql from the macro now:

import gql from 'graphql-tag.macro';

const query = gql`
  query {
    hello {
      world
    }
  }
`;



鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
Diizzayy/nuxt-graphql-client: ⚡️ Minimal GraphQL Client + Code Generation for ...发布时间:2022-06-22
下一篇:
graphql/faq: GraphQL FAQ发布时间:2022-06-22
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap