JSON в TypeScript

Что делает инструмент

Генератор JSON в TypeScript читает пример JSON, например ответ API или файл конфигурации, и пишет интерфейсы TypeScript, которые его описывают. Вместо того чтобы вручную набирать каждое поле, вставьте один настоящий ответ и получите типы, готовые для результатов fetch, состояния Redux или тестовых данных.

Генератор смотрит на каждое значение, а не только на первое. Числа становятся number, текст — string, вложенные объекты получают свои интерфейсы, а элементы массива объединяются, так что поле, которое есть лишь в некоторых элементах, помечается как необязательное, а поле, иногда равное null, типизируется как допускающее null.

Как пользоваться

1. Вставьте JSON в поле ввода, загрузите файл .json или нажмите Пример.
2. Задайте имя корневого типа и выберите стиль: interface или type, null как | null или как необязательные поля, свойства readonly и нужно ли добавлять export к каждому объявлению.
3. Скопируйте TypeScript или скачайте его как файл .ts.

Некорректный JSON отмечается строкой и столбцом ошибки, чтобы пример можно было сразу исправить.

Пример

Этот JSON:

{ "id": 7, "name": "Ada", "tags": ["admin"], "manager": { "id": 1, "email": null } }

превращается в такие объявления:

export interface Root {
  id: number;
  name: string;
  tags: string[];
  manager: Manager;
}

export interface Manager {
  id: number;
  email: null;
}

Советы

• Один пример показывает только то, что в нём есть. Если поле может быть строкой или null, включите оба варианта или поместите несколько примеров в массив, чтобы они объединились.
• Имена полей, которые не являются допустимыми идентификаторами, например first-name, пишутся в кавычках, поэтому результат всегда компилируется.
• Результат — это отправная точка. Сужайте строковые поля до объединений литералов или Date, если знаете больше, чем показывает пример.
• Нужен Go? Конвертер JSON в Go использует тот же вывод типов и пишет структуры с тегами json.