Gå til hovedindhold
LibraTool logoLibraTool

Gratis JSON til TypeScript-konverter

Generer TypeScript-interfaces eller type-aliaser fra et vilkårligt JSON-objekt eller -array. Indsæt din JSON og få klar-til-brug TypeScript-typer øjeblikkeligt.

Virker offline, når den er indlæst
export interface User {
  id: number;
  name: string;
  email: string;
  isActive: boolean;
  score: number;
  tags: string[];
  address?: null;
}

export interface Root {
  user: User;
  createdAt: string;
  version: number;
}

Almindelige anvendelser

  • Generer TypeScript-typer fra API-svarIndsæt et API JSON-svar og generér øjeblikkeligt TypeScript-grænseflader for at skrive-sikre din frontend-kode.
  • TypeScript-typer til konfiguration og indstillingsobjekterGenerer TypeScript-grænseflader fra JSON-konfigurationsfiler for at tilføje typesikkerhed til dine programindstillinger.
  • Generer TypeScript-typer fra databaseposterKonverter JSON-eksporterede databaseposter eller ORM-forespørgselsresultater til TypeScript-grænseflader til datatypning.
  • Typedata og testfixturesGenerer TypeScript-grænseflader fra JSON-mockdata og testfixtures for at skrive dine enhedstest og Storybook-historier.
  • Skriv tredjepartsAPI-svarGenerer TypeScript-grænseflader fra tredjepartsAPI-svar, hvor officielle typer mangler eller er forældet.

Sådan fungerer det

Værktøjet bruger en håndskrevet rekursiv typeinferensalgoritme uden eksterne biblioteker — JSON.parse til at validere og fortolke inputtet og derefter en egen gennemgang, der besøger hver værdi i JSON-træet og udsender TypeScript-interface- eller type-deklarationer direkte i browseren. Intet sendes til en server.

  1. 1
    JSON fortolkes og valideres
    Dit input gives til JSON.parse. Fejler det, vises den præcise fortolkningsfejl straks under inputtet. En vellykket fortolkning giver et typet værditræ, der driver resten af konverteringen.
  2. 2
    Rekursiv typeinferens
    En rekursiv getType-funktion besøger hver node: primitive værdier bliver til string, number, boolean eller null; objekter udløser et nyt navngivet interface; arrays af objekter får deres nøgler flettet på tværs af alle elementer, så nøgler, der kun findes i nogle elementer, bliver valgfrie, og modstridende værdityper sammenføjes med |.
  3. 3
    Kollisionssikker navngivning af interfaces
    Hvert indlejret objekt får et PascalCase-navn afledt af dets JSON-nøgle (snake_case, kebab-case og mellemrum normaliseres). Hvis to strukturelt forskellige objekter ville få samme navn, tilføjes et nummer (Data, Data2, …) i stedet for stille at overskrive den tidligere definition.
  4. 4
    Outputtet vises og kan downloades
    Indlejrede interfaces udsendes først, derefter rodtypen, formateret som export interface eller export type afhængigt af dit valg. Resultatet kan kopieres til udklipsholderen eller downloades som en .ts-fil — alt bygget med en almindelig Blob og uden tur til en server.

Relaterede værktøjer

📋

JSON Schema til formular

Indsæt et JSON Schema og få en live, fungerende formular — tekst-, tal-, afkrydsningsfelts-, dropdown- og listefelter — og kopiér derefter det JSON, dine input producerer. Ideel til prototyping af API-anmodningslegemer. Kører i din browser.

Prøv det
⌨️

Skrivehastigheds­test (WPM)

Måling af din skrivehastighed (WPM) og nøjagtighed med tids-, ord-, citat-, brugerdefineret og zen-tests. Direkte WPM, rå hastighed, konsistens, resultatkurve, flere sprog og feedback pr. tegn — alt i din browser.

Prøv det
📐

CSS clamp()-generator

Generer en flydende CSS clamp()-værdi til responsiv typografi og afstand. Angiv min/max-størrelse og viewport-interval, se en liveforhåndsvisning og kopiér den ene linje CSS.

Prøv det

Ofte stillede spørgsmål