Как создать базовые интерфейсы TypeScript из схемы Swagger?

Я ищу способ создания упрощенных интерфейсов TypeScript из схемы Swagger. Большинство решений, которые я нахожу, излишне сложны.

Я хотел бы генерировать такие интерфейсы:

export interface IBar {
    a?: string;
    b: number;
    c: Date;
    baz?: IBaz;
}

export interface IBaz {
    d: number;
    color: Color;
}

export enum Color {
    RED = 0,
    GREEN = 1,
    BLUE = 2,
}

Из такой схемы:

    {
  "x-generator": "NSwag v11.14.0.0 (NJsonSchema v9.10.24.0 (Newtonsoft.Json v9.0.0.0))",
  "swagger": "2.0",
  "info": {
    "title": "",
    "version": ""
  },
  "schemes": [],
  "consumes": [
    "application/json"
  ],
  "produces": [
    "application/json"
  ],
  "paths": {
    "/api/Foo/GetBarDescriptions": {
      "get": {
        "tags": [
          "Foo"
        ],
        "operationId": "Foo_GetBarDescriptions",
        "parameters": [],
        "responses": {
          "200": {
            "description": "",
            "schema": {
              "type": "array",
              "items": {
                "type": "string"
              }
            },
            "x-nullable": true
          }
        }
      }
    },
    "/api/Foo/GetBar": {
      "get": {
        "tags": [
          "Foo"
        ],
        "operationId": "Foo_GetBar",
        "parameters": [
          {
            "type": "integer",
            "name": "id",
            "in": "query",
            "required": true,
            "x-nullable": false,
            "format": "int32"
          }
        ],
        "responses": {
          "200": {
            "description": "",
            "schema": {
              "$ref": "#/definitions/Bar"
            },
            "x-nullable": true
          }
        }
      }
    },
    "/api/Foo/SetBar": {
      "post": {
        "tags": [
          "Foo"
        ],
        "operationId": "Foo_SetBar",
        "parameters": [
          {
            "name": "value",
            "in": "body",
            "required": true,
            "schema": {
              "$ref": "#/definitions/Bar"
            },
            "x-nullable": true
          }
        ],
        "responses": {
          "204": {
            "description": ""
          }
        }
      }
    }
  },
  "definitions": {
    "Bar": {
      "type": "object",
      "additionalProperties": false,
      "required": [
        "B",
        "C"
      ],
      "properties": {
        "A": {
          "type": "string"
        },
        "B": {
          "type": "integer",
          "format": "int32"
        },
        "C": {
          "type": "string",
          "format": "date-time"
        },
        "Baz": {
          "$ref": "#/definitions/Baz"
        }
      }
    },
    "Baz": {
      "type": "object",
      "additionalProperties": false,
      "required": [
        "D",
        "Color"
      ],
      "properties": {
        "D": {
          "type": "number",
          "format": "decimal"
        },
        "Color": {
          "$ref": "#/definitions/Color"
        }
      }
    },
    "Color": {
      "type": "integer",
      "description": "",
      "x-enumNames": [
        "RED",
        "GREEN",
        "BLUE"
      ],
      "enum": [
        0,
        1,
        2
      ]
    }
  },
  "parameters": {},
  "responses": {},
  "securityDefinitions": {}
}

Ответы

Ответ 1

Не уверен, что это нормальный способ сделать это, это первый раз, когда я играю с Swagger.

Я наткнулся на следующую ссылку и вставил схему из проекта, с которым интегрируюсь. В верхнем меню "Generate Client" я выбрал один из пресетов TypeScript, и он создал минимальный проект, в котором я мог бы извлечь нужные биты, интерфейс и классы и т.д.

http://editor.swagger.io/#/

Я пытался запустить вашу схему. Вот небольшая выдержка из сгенерированного кода:

export interface Bar {
    "a"?: string;
    "b": number;
    "c": Date;
    "baz"?: Baz;
}

export interface Baz {
    "d": number;
    "color": Color;
}

/**
 * 
 */
export type Color = "0" | "1" | "2";

Может быть, с немного более тонкой настройкой он может сделать именно то, что вы ищете.

Дальнейшее чтение может быть о таких инструментах, как https://github.com/swagger-api/swagger-codegen, но онлайн-редактор - быстрый и грязный способ сделать это.

Ответ 2

Вы также можете посмотреть генератор кода клиента autorest.typescript. Он обеспечивает хорошие интерфейсы для всех определений моделей, точно определяет свойства readonly и перечисления. Он поддерживает множество пользовательских расширений, которые могут быть полезны для улучшения пользовательского опыта сгенерированного клиента. Вы можете взглянуть на некоторые сгенерированные образцы клиентов.

Бонус: Созданный клиентский скрипт работает в node.js, а также в браузере с помощью webpack.

Ответ 3

Вы можете попробовать этот инструмент sw2dts, который генерирует код, как показано ниже:

export interface Bar {
    A?: string;
    B: number; // int32
    C: string; // date-time
    Baz?: Baz;
}
export interface Baz {
    D: number; // decimal
    Color: Color;
}
/**
 * 
 */
export type Color = 0 | 1 | 2;

Перечисление Color, похоже, нуждается в небольшой настройке, которая должна содержать имена свойств для перебора, а не вещественное число.

Ответ 4

Вы также можете просто генерировать каждый интерфейс из каждой схемы с помощью простого json файла для преобразования в машинописный текст http://json2ts.com/. Это не полностью автоматизировано, но лучше, чем ничего... и просто.

Ответ 5

Я использую dtsgen, и он хорошо работает в моем случае.

yarn dtsgen --out ./path/to/generated-types.d.ts ./path/to/input/swagger.json.or.yml

Ответ 6

Вдохновленный fooobar.com/info/6526020/...:

Swagger Codegen генерирует заглушки для серверов и клиентские SDK для различных языков и сред, включая Node.js.

Чтобы создать заглушку сервера Node.js, запустите -l nodejs-server аргументом -l nodejs-server.

пример (Mac):

swagger-codegen generate -l typescript-angular -i swagger.yaml -o ~/Downloads/ts-test