Przejdź do treści
Numio

Generator dopasowywania fragmentów GraphQL — Numio

Tworzy mapę possibleTypes ze schematu GraphQL przy użyciu @graphql-codegen/fragment-matcher. Każdy interfejs i unia są wymienione wraz z typami obiektów, które je implementują lub do nich należą, gotowe dla InMemoryCache klienta Apollo.

Konfigurowanie InMemoryCache({ possibleTypes }), aby fragmenty interfejsów lub unii pasowały poprawnie w kliencie Apollo 3.

GraphQL Schema

Fragment Matcher

Kiedy go używać

  • Konfigurowanie InMemoryCache({ possibleTypes }), aby fragmenty interfejsów lub unii pasowały poprawnie w kliencie Apollo 3.
  • Regeneracja mapy possibleTypes po dodaniu nowego typu do unii, bez uruchamiania generatora kodu CLI.

Jak używać

  1. Wklej schemat zawierający definicje interfejsów lub unii do edytora schematów GraphQL.
  2. Przeczytaj wygenerowany obiekt possibleTypes; typy, które nie są częścią interfejsu lub unii, nie są wyświetlane.
  3. Zapisz go jako plik .ts i przekaż domyślny eksport possibleTypes do InMemoryCache.

Schemat GraphQL

interface Node {
  id: ID!
}
type User implements Node {
  id: ID!
  name: String!
}
type Post implements Node {
  id: ID!
  title: String!
}
union SearchResult = User | Post
type Query {
  search(term: String!): [SearchResult!]!
}

possibleTypes (TypeScript)

export interface PossibleTypesResultData {
  possibleTypes: {
    [key: string]: string[]
  }
}
const result: PossibleTypesResultData = {
  possibleTypes: {
    Node: ["User", "Post"],
    SearchResult: ["User", "Post"],
  },
}
export default result

Szczegóły i ograniczenia

Używany jest tylko schemat; na tej stronie nie ma edytora dokumentów.

Dane wyjściowe to TypeScript: interfejs PossibleTypesResultData, wpisana stała wynikowa i domyślny eksport.

Schemat bez interfejsów i unii tworzy pusty obiekt possibleTypes. Generowanie odbywa się w środowisku internetowym w przeglądarce.

FAQ

Czy to stary format IntrospectionFragmentMatcher?

Nie. Dane wyjściowe wykorzystują kształt possibleTypes (nazwa nadtypu odwzorowana na tablicę nazw podtypów) używany przez klienta Apollo 3, a nie format wyniku introspekcji klienta Apollo 2.

Jak korzystać z danych wyjściowych w kliencie Apollo?

Zaimportuj eksport domyślny i przekaż result.possibleTypes do new InMemoryCache({ possibleTypes }).

Specyfikacje i referencje