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
}