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
}