create-react-app 加载 .graphql 文件

🌙
手机阅读
本文目录结构
a'xi'he

要加载.gql.graphql文件,首先通过运行以下命令安装graphql和graphql.macro软件包:

npm install --save graphql graphql.macro

然后,无论何时要加载.gql.graphql文件,请import { loader } from 'graphql.macro';

import { loader } from 'graphql.macro';
const query = loader('./foo.graphql');

文件将自动内联!如果上述文件foo.graphql包含以下内容:

query {
  hello {
    world
  }
}

前面的示例变为:

const query = {
  'kind': 'Document',
  'definitions': [{
    ...
  }],
  'loc': {
    ...
    'source': {
      'body': '\\\\n  query {\\\\n    hello {\\\\n      world\\\\n    }\\\\n  }\\\\n',
      'name': 'GraphQL request',
      ...
    }
  }
};

您还可以使用gql模板标记,就像使用graphql-tag软件包中一样,还可以使用内联分析结果。

import { gql } from 'graphql.macro';
 
const query = gql`
  query User {
    user(id: 5) {
      lastName
      ...UserEntry1
    }
  }
`;
axihe
axihe

AXIHE / 精选教程

浏览全部教程

HTML

CSS

JS

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili 和抖音。

关注我: Github / 知乎

如果你加我的私人微信,麻烦写上您的 称呼,所在地区,职业,方便我备注,谢谢


本站的微信公众号

阿西河前端教程

Anbang

安邦的私人微信

微信号: yaolushan

Anbang

Bilibili(B站)

朱安邦

Anbang
axihe