Come si usa
- Incolla il JSON nella casella di input, apri un file .json oppure prova l'esempio.
- Imposta il nome del tipo radice, ad esempio Order o ApiResponse.
- Scegli tra dichiarazioni interface o type e se aggiungere export e readonly.
- Copia il TypeScript generato o scaricalo come types.ts.
Come funziona
Il generatore esamina l'intero documento JSON e registra i tipi di valore trovati in ogni posizione. Ogni oggetto JSON diventa una propria dichiarazione con nome. Il nome deriva dalla chiave della proprietà scritta in PascalCase, quindi “shipping_address” diventa ShippingAddress. Gli elementi di un array vengono denominati in base al singolare della chiave: “items” produce Item, “categories” produce Category, mentre le chiavi che non sembrano plurali ricevono un suffisso “Item”.
Tutti gli oggetti all'interno di uno stesso array vengono uniti in un'unica interfaccia. Se una chiave compare solo in alcuni di essi, viene contrassegnata come opzionale con “?”. Se un valore ha tipi diversi in punti diversi, il tipo è un'unione come string | number. null viene mantenuto come tipo a sé, quindi un campo che a volte è null diventa string | null. Un array vuoto diventa unknown[], perché non c'è nulla da cui dedurre. Due oggetti con esattamente le stesse proprietà e gli stessi tipi condividono una sola interfaccia invece di produrre duplicati. Le chiavi che non sono identificatori validi, come “first-name”, vengono messe tra virgolette.
Il risultato descrive solo il campione incollato. Un campo che nella realtà è opzionale o può essere null risulterà obbligatorio e non nullo se il campione non lo mostra, e le date arrivano come semplici stringhe. Verifica i tipi rispetto alla documentazione della tua API prima di fare affidamento su di essi.
Esempi
Tipizzare una risposta API
Incolla un ordine dall'API del tuo negozio con il nome radice Order. Ottieni le interfacce Order, Customer, Item e Shipping, con note?: string su Item perché solo uno dei due elementi ha una nota.
Configurazione in sola lettura
Incolla un config.json, spunta “Rendi le proprietà in sola lettura” e incolla il risultato in config.d.ts, così eventuali scritture accidentali alla configurazione vengono rilevate dal compilatore.
Array al livello superiore
Un endpoint di elenco restituisce [{…}, {…}]. Con il nome radice Product, l'output inizia con “export type Product = ProductItem[];” seguito dall'interfaccia ProductItem.
Domande frequenti
Perché un campo è opzionale nell'output?
Perché almeno un oggetto nello stesso array non possiede quella chiave. Se ce l'hanno tutti gli oggetti, è obbligatoria. Incolla più record per ottenere campi opzionali più accurati.
Perché una data viene tipizzata come stringa?
JSON non ha un tipo per le date, quindi vengono rappresentate come stringhe. Il generatore non prova a indovinare il formato. Modifica tu il tipo se il tuo codice le converte in oggetti Date.
Qual è la differenza tra interface e type?
Per la forma degli oggetti funzionano quasi allo stesso modo. Le interfacce possono essere estese e unite da dichiarazioni successive; gli alias di tipo non possono essere riaperti. Scegli lo stile già usato nella tua codebase.
Può generare una validazione a runtime come gli schemi Zod?
No. Produce solo dichiarazioni TypeScript, che vengono verificate in fase di compilazione e non convalidano i dati a runtime.
Privacy
Il tuo JSON viene analizzato solo nel browser. Nulla viene caricato, archiviato o incluso nelle statistiche.