GraphQL vers TypeScript
GraphQL Code Generator

GraphQL SDL to TypeScript Types & Interfaces Converter

Transformez vos types, inputs et énumérations GraphQL SDL directement en interfaces et types TypeScript propres et sans dépendances.

Préréglages :
Entrée
/**
 * -----------------------------------------------------------------------------
 * GraphQL SDL to TypeScript Types & Interfaces
 * Zero-dependency, client-synthesized TypeScript definitions.
 * -----------------------------------------------------------------------------
 */

/* =============================================================================
 * GRAPHQL SCALARS & UTILITY HELPER TYPES
 * ============================================================================= */

export type Maybe<T> = T | null;
export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
export type MakeOptional<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]?: Maybe<T[SubKey]> };
export type MakeMaybe<T, K extends keyof T> = Omit<T, K> & { [SubKey in K]: Maybe<T[SubKey]> };

/** All custom GraphQL scalar types defined in schema */
export type DateTime = string;
export type JSON = Record<string, any>;


/* =============================================================================
 * ENUMS
 * ============================================================================= */

export enum UserRole {
  ADMIN = 'ADMIN',
  CUSTOMER = 'CUSTOMER',
  VENDOR = 'VENDOR',
}

export enum OrderStatus {
  PENDING = 'PENDING',
  PROCESSING = 'PROCESSING',
  SHIPPED = 'SHIPPED',
  DELIVERED = 'DELIVERED',
  CANCELLED = 'CANCELLED',
}


/* =============================================================================
 * GRAPHQL INTERFACES, OBJECT TYPES & UNIONS
 * ============================================================================= */

export interface Node {
  id: string;
}

export interface Timestamps {
  createdAt: string;
  updatedAt: string | null;
}

/**
 * Represents a customer or administrator account in the store.
 */
export interface User extends Node, Timestamps {
  id: string;
  email: string;
  displayName: string;
  role: UserRole;
  orders: Order[];
  defaultAddress: Address | null;
  createdAt: string;
  updatedAt: string | null;
}

export interface Product extends Node, Timestamps {
  id: string;
  sku: string;
  title: string;
  price: number;
  inventoryCount: number;
  tags: string[];
  createdAt: string;
  updatedAt: string | null;
}

export interface Order extends Node, Timestamps {
  id: string;
  orderNumber: string;
  customer: User;
  status: OrderStatus;
  items: OrderItem[];
  totalAmount: number;
  shippingAddress: Address;
  createdAt: string;
  updatedAt: string | null;
}

export interface OrderItem {
  id: string;
  product: Product;
  quantity: number;
  unitPrice: number;
}

export interface Address {
  street: string;
  city: string;
  postalCode: string;
  country: string;
}

export interface Query {
  me: User | null;
  user: User | null;
  product: Product | null;
  products: Product[];
  search: SearchResult[];
}

export interface Mutation {
  createProduct: Product;
  checkoutCart: Order;
  cancelOrder: Order;
}

export type SearchResult = Product | User | Order;


/* =============================================================================
 * GRAPHQL INPUT OBJECTS & OPERATION ARGUMENTS
 * ============================================================================= */

export interface CreateProductInput {
  sku: string;
  title: string;
  price: number;
  inventoryCount?: number | null;
  tags?: string[] | null;
}

export interface CheckoutCartInput {
  userId: string;
  itemIds: string[];
  shippingAddress: AddressInput;
}

export interface AddressInput {
  street: string;
  city: string;
  postalCode: string;
  country: string;
}

/**
 * Arguments for User.orders
 */
export interface UserOrdersArgs {
  limit?: number | null;
  offset?: number | null;
}

/**
 * Arguments for Query.user
 */
export interface QueryUserArgs {
  id: string;
}

/**
 * Arguments for Query.product
 */
export interface QueryProductArgs {
  id: string;
}

/**
 * Arguments for Query.products
 */
export interface QueryProductsArgs {
  limit?: number | null;
  cursor?: string | null;
}

/**
 * Arguments for Query.search
 */
export interface QuerySearchArgs {
  query: string;
  limit?: number | null;
}

/**
 * Arguments for Mutation.createProduct
 */
export interface MutationCreateProductArgs {
  input: CreateProductInput;
}

/**
 * Arguments for Mutation.checkoutCart
 */
export interface MutationCheckoutCartArgs {
  input: CheckoutCartInput;
}

/**
 * Arguments for Mutation.cancelOrder
 */
export interface MutationCancelOrderArgs {
  orderId: string;
  reason?: string | null;
}

Schema Symbols
15 Entités
Object types, inputs, interfaces, enums and unions parsed
Champs
56 Générés
Strongly-typed TypeScript attributes and argument definitions
Compilation Speed
$<span suppressHydrationWarning>{generated.metrics.parseTimeMs}ms</span> (AST Client Pur)
Description

Exécution Locale Zero-Knowledge

Tous les traitements, analyses et générations s'exécutent strictement dans la mémoire de votre navigateur. Zéro transmission vers un serveur externe.

Moteur Réactif Submilliseconde

All data payloads remain strictly local with zero external server communication.

Production Ready Export

Clean, optimized output formats ready for immediate deployment.

Référence technique et guide d'architecture

Guide de développement du convertisseur GraphQL SDL vers types et interfaces TypeScript — Guide de référence

Transformez vos types, inputs et énumérations GraphQL SDL directement en interfaces et types TypeScript propres et sans dépendances.

Paramètres clés et contrôles

Format de déclarationEnum (interface | type)

Génère les structures TypeScript sous forme d'interfaces extensibles ou d'alias de type stricts.

Par défaut : interface
Stratégie pour champs nullablesEnum (null | undefined | both)

Stratégie de typage appliquée aux champs facultatifs ou nullables sans modificateur non-null (!).

Par défaut : both
Syntaxe des tableauxEnum (T[] | Array<T>)

Format de typage appliqué aux collections de listes GraphQL [Type].

Par défaut : T[]
Représentation des énumérationsEnum (enum | union | const_object)

Format de sortie pour les enums GraphQL (enum standard, union littérale de chaînes ou objet avec assertion const).

Par défaut : union
Mappage des scalaires personnalisésRecord<string, string>

Dictionnaire JSON associant des types scalaires spécifiques à des types primitifs TypeScript.

Par défaut : {"DateTime": "string", "JSON": "Record<string, unknown>"}

Conseils de pro et bonnes practices

Activer __typename discriminé

Activez la propriété __typename dans les interfaces générées pour tirer parti du rétrécissement automatique d'unions discriminées dans Apollo Client, Urql et les caches Relay.

Unions de chaînes pour les enums

Générez des unions littérales de chaînes ("ADMIN" | "USER") plutôt que des enums TypeScript pour éviter tout code JavaScript additionnel et maximiser le tree-shaking.

Séparer types d'entrée et entités

Séparez clairement les types d'objets input GraphQL et les interfaces d'arguments (ex: CreateUserInput) des entités du domaine pour des composants d'API modulaires.

Nullabilité des listes GraphQL

Prenez garde à l'emplacement du point d'exclamation : [Item!]! génère Item[], [Item]! produit (Item | null)[] et [Item!] donne Item[] | null.

Pièges courants et dépannage

Erreur de compilation TS2304: Cannot find name sur les scalaires personnalisés

Définissez un mappage explicite dans les paramètres des scalaires personnalisés (par exemple DateTime vers string ou Date, et BigInt vers string).

Références circulaires dans des schémas récursifs provoquant des erreurs de typage

Basculez le Format de déclaration de "type" vers "interface", car les interfaces TypeScript gèrent nativement les définitions circulaires et autoréférentielles sans limite de récursion.

Directives de schéma non reconnues provoquant des avertissements de syntaxe

Le parseur convertit automatiquement les directives @deprecated en balises JSDoc ; vérifiez que vos directives personnalisées respectent la syntaxe AST valide du SDL.

Foire aux questions (FAQ)

Comment les contraintes non-nulles (!) de GraphQL sont-elles converties en TypeScript ?▼

Un champ avec point d'exclamation (ex: name: String!) devient une propriété obligatoire (name: string). Sans !, le champ est généré comme optionnel ou nullable (name?: string | null) selon votre stratégie.

L'outil prend-il en charge les Unions et Interfaces GraphQL ?▼

Oui. Les interfaces GraphQL sont traduites en interfaces TypeScript extensibles et les unions sont compilées en types d'union discriminée exploitant la propriété discriminante __typename.

Les directives comme @deprecated sont-elles converties en annotations TypeScript ?▼

Oui. Les directives @deprecated(reason: "...") sont analysées depuis l'AST du SDL et générées sous la forme de blocs JSDoc /** @deprecated ... */ au-dessus de chaque propriété.

Mon schéma GraphQL SDL propriétaire est-il envoyé à des serveurs distants ?▼

Non. L'analyse lexicale du SDL, la construction de l'AST et la génération de code TypeScript s'exécutent à 100 % localement dans le bac à sable de votre navigateur, sans requête externe.

Peut-on convertir à la fois des types input et des types classiques de GraphQL ?▼

Oui. Les déclarations GraphQL type et input sont toutes deux prises en charge, générant des types rigoureux pour vos variables de requêtes et mutations.

Outils et utilitaires connexes

Tous les outils →
K8S Configmap Secret Generator Référence DéveloppeurDéveloppement

Utilitaire de développement pour générer des manifestes Kubernetes ConfigMap et Secret avec encodage Base64, stringData, TLS, Docker registry auth et flags de ressources immuables.

Ouvrir l'outil→
Guide Développeur du Générateur Kubernetes HorizontalPodAutoscaler (HPA v2)Développement

Générez des manifestes YAML HPA v2 avec objectifs d'utilisation CPU et mémoire, métriques personnalisées et politiques de stabilisation de mise à l'échelle.

Ouvrir l'outil→
Générateur et Optimiseur de Configuration de Production Redis (redis.conf)Développement

Générez des fichiers de configuration redis.conf taillés pour la production avec gestion fine de maxmemory, persistance RDB/AOF, liaison réseau étanche et authentification ACL.

Ouvrir l'outil→
Guide Développeur : Optimiseur et Générateur Hardware pour PostgreSQL (postgresql.conf)Développement

Calculez et générez des paramètres postgresql.conf optimisés en fonction des spécifications matérielles (shared_buffers, work_mem, effective_cache_size, max_connections).

Ouvrir l'outil→
Guide Développeur du Générateur d'Unités Systemd (.timer et .service) sous LinuxDéveloppement

Créez et structurez des unités de minuterie systemd et des services associés prêts pour la production avec planification OnCalendar, intervalles OnBootSec, exécution Persistent et délais aléatoires.

Ouvrir l'outil→
Guide Développeur du Générateur de Configuration TypeScript (tsconfig.json)Développement

Générez des configurations tsconfig.json modernes et robustes pour Next.js, Node.js, Vite ou bibliothèques avec mode strict, alias de chemins et résolution de modules.

Ouvrir l'outil→