Vai al contenuto

Dallo schema JSON alle definizioni TypeScript — Numio

Compila un JSON Schema in interfacce TypeScript con json-schema-to-typescript. Le proprietà non elencate in "required" diventano facoltative e gli oggetti ricevono una firma indice, a meno che additionalProperties sia false.

Il tuo API pubblica file di schema JSON e desideri interfacce corrispondenti per il codice client che li utilizza.

JSON Schema

TypeScript

Quando usarlo

  • Il tuo API pubblica file di schema JSON e desideri interfacce corrispondenti per il codice client che li utilizza.
  • Mantieni i file di configurazione convalidati da uno schema e desideri controllare il tipo in cui viene caricata la configurazione.

Come si usa

  1. Incolla un JSON Schema nel pannello JSON Schema. "title" determina il nome dell’interfaccia; senza questo campo, la radice si chiama MySchema.
  2. La conversione viene eseguita nel browser durante la digitazione; la pagina non ha impostazioni e non aggiunge alcun banner di commento.
  3. Copia le interfacce dal pannello TypeScript. La pagina li formatta con Prettier, quindi utilizzano il rientro a due spazi e nessun punto e virgola.

Schema JSON

{
  "title": "Address",
  "type": "object",
  "properties": {
    "street": { "type": "string", "minLength": 1 },
    "zip": { "type": "string", "pattern": "^[0-9]{5}$" },
    "country": { "enum": ["US", "CA"], "default": "US" },
    "unit": { "type": ["integer", "null"] },
    "lines": { "type": "array", "items": { "type": "string" }, "maxItems": 3 },
    "geo": { "type": "object", "required": ["lat", "lng"],
      "properties": { "lat": { "type": "number" }, "lng": { "type": "number" } } }
  },
  "required": ["street", "zip"]
}

Interfacce TypeScript

export interface Address {
  street: string
  zip: string
  country?: "US" | "CA"
  unit?: number | null
  lines?: [] | [string] | [string, string] | [string, string, string]
  geo?: {
    lat: number
    lng: number
    [k: string]: unknown
  }
  [k: string]: unknown
}

Dettagli e limiti

Gli oggetti senza "additionalProperties": false ricevono [k: string]: unknown, quindi il tipo continua a consentire chiavi aggiuntive.

maxItems in un array viene espanso in un’unione di tuple, come "lines" nell’esempio.

Le voci $ref locali come #/definitions/Tag diventano interfacce esportate separate.

La pagina esegue il risultato tramite Prettier senza punto e virgola, rimuovendo anche le parentesi ridondanti attorno alle unioni come "US" | "CA".

FAQ

Come vengono digitati i valori nulli?

"type": ["integer", "null"] diventa (number | null). Sia integer sia number vengono mappati a number.

Come posso eliminare [k: string]: unknown?

Aggiungi "additionalProperties": false a ogni schema di oggetto; la firma dell'indice viene quindi omessa.

Come viene denominata l'interfaccia root?

Dal campo "title" dello schema convertito in PascalCase ("Example Schema" diventa ExampleSchema). Senza un titolo, il nome è MySchema.

Lo schema viene inviato a un server?

No. La funzione di compilazione json-schema-to-typescript viene eseguita nel browser in questa pagina.

Specifiche e riferimenti