GraphQL

Parcel 通过 @parcel/transformer-graphql 插件支持将在单独文件中定义的 GraphQL 查询导入到 JavaScript 中。当检测到 .graphql.gql 文件时,它将自动安装到您的项目中。

使用示例

#

GraphQL 文件作为字符串导入到 JavaScript 中,您可以直接将其发送到服务器或与任何您喜欢的 GraphQL 库一起使用。

app.js:
import query from "./query.graphql";
query.graphql:
{
user(id: 5) {
firstName
lastName
}
}

依赖

#

Parcel 还支持使用特殊的注释语法将在单独文件中定义的片段导入到另一个 GraphQL 文件中。这些片段将被捆绑到一个单一的 GraphQL 查询中,并作为字符串返回到您的代码。

您可以导入文件中的所有片段:

# import "fragments.graphql"
# import * from "fragments.graphql"

或列出您希望导入的特定片段:

# import UserFragment, AddressFragment from "fragments.graphql"

以下是一个完整的示例,展示如何在更大的 GraphQL 查询中使用导入:

query.graphql:
# import UserFragment from "user.graphql"
# import "address.graphql"

query UserQuery($id: ID) {
user(id: $id) {
...UserFragment
address {
...AddressFragment
}
}
}
user.graphql:
fragment UserFragment on User {
firstName
lastName
}
address.graphql:
fragment AddressFragment on Address {
city
state
country
}