OpenAPI → TypeScript

OpenAPI 3.x ドキュメントから、よく使う openapi-typescript の生成オプション付きで TypeScript 型をブラウザ内だけで変換します。

OpenAPI ドキュメント
OpenAPI 3.0 または 3.1 のドキュメントを JSON または YAML で貼り付けるか、ファイルから読み込むか、CORS 対応 URL から取得します。
TypeScript 出力
生成される TypeScript 型は、ブラウザ対応の openapi-typescript パイプラインと下のオプションで作成されます。
/**
 * This file was auto-generated by openapi-typescript.
 * Do not make direct changes to the file.
 */

export interface paths {
    "/users": {
        parameters: {
            query?: never;
            header?: never;
            path?: never;
            cookie?: never;
        };
        get: {
            parameters: {
                query?: never;
                header?: never;
                path?: never;
                cookie?: never;
            };
            requestBody?: never;
            responses: {
                /** @description OK */
                200: {
                    headers: {
                        [name: string]: unknown;
                    };
                    content: {
                        "application/json": components["schemas"]["User"][];
                    };
                };
            };
        };
        put?: never;
        post?: never;
        delete?: never;
        options?: never;
        head?: never;
        patch?: never;
        trace?: never;
    };
}
export type webhooks = Record<string, never>;
export interface components {
    schemas: {
        User: {
            id: string;
            name: string;
            /** @enum {string} */
            role?: "admin" | "editor" | "viewer";
        };
    };
    responses: never;
    parameters: never;
    requestBodies: never;
    headers: never;
    pathItems: never;
}
export type $defs = Record<string, never>;
export type operations = Record<string, never>;
生成オプション
元のドキュメントを変更せずに、生成される型を調整します。

OpenAPI to TypeScript Converter とは?

OpenAPI to TypeScript Converter は、OpenAPI 3.x ドキュメントをブラウザ内でそのまま TypeScript 型に変換します。すばやく型を確認したいとき、宣言ファイルをダウンロードしたいとき、あるいは schema をサーバーに送らずに openapi-typescript のオプションを安全に試したいときに便利です。

使う場面

JSON または YAML の OpenAPI schema がすでにあり、フロントエンドアプリや SDK の試作、API レビュー向けに型付きのリクエスト / レスポンスモデルが欲しいときに使います。出力をリポジトリに反映する前に生成オプションを比較したい場合にも特に役立ちます。

生成前に

このブラウザ版は、bundle 済みの OpenAPI 3.0 と 3.1 ドキュメントに対応しています。schema に外部 $ref の参照先が残っている場合は、先に bundle するか inline 化してから、ここで最終的な TypeScript 出力を生成してください。