在单独的文件 (.graphql) 中单独的页面 graphQL 查询答案

【问题标题】：Separate page graphQL queries in separate files (.graphql)在单独的文件 (.graphql) 中单独的页面 graphQL 查询
【发布时间】：2019-01-12 07:06:33
【问题描述】：

是否可以在单独的 .graphql 文件中分离页面 graphql 查询，然后将其导入页面文件中？我假设我需要添加某种 og .graphQL 加载器？

【问题讨论】：

【解决方案1】：

据我所知，开箱即用是不可能的。拆分查询的唯一方法是使用片段： https://www.gatsbyjs.org/docs/querying-with-graphql/#fragments

但是，如果您想开始讨论，我建议您在 GitHub 上打开一个问题。

【讨论】：

【解决方案2】：

检查 'apollo-universal-starter-kit' - 应该适用于 gatsby

【讨论】：

【解决方案3】：

如果您想用.graphql 或.gql 文件扩展名编写query、mutation。

你需要graphql-tag/loader，这是我的webpack.config.js：

  {
    test: /\.(graphql|gql)$/,
    exclude: /node_modules/,
    use: 'graphql-tag/loader'
  }

【讨论】：

【解决方案4】：

您可以使用graphql-import 来执行此操作。

示例：假设如下目录结构：

.
├── schema.graphql
├── posts.graphql
└── comments.graphql

schema.graphql

# import Query.*, Mutation.* from "posts.graphql"
# import Query.*, Mutation.* from "comments.graphql"

posts.graphql

# import Comment from 'comments.graphql'

type Post {
  comments: [Comment]
  id: ID!
  text: String!
  tags: [String]
}

comments.graphql

type Comment {
  id: ID!
  text: String!
}

您可以在here查看完整文档

【讨论】：