Перейти к содержимому

Генератор объявлений TypeScript из Flow — Numio

Преобразует код Flow в TypeScript с помощью flow-to-ts, а затем компилятором TypeScript генерирует только файл объявлений .d.ts. Тела удаляются, а параметры со значениями по умолчанию становятся необязательными.

Пакет написан на Flow, и вы хотите поставлять типы TypeScript для пользователей TypeScript, не переводя исходный код.

Flow

TypeScript Declarations

Когда пригодится

  • Пакет написан на Flow, и вы хотите поставлять типы TypeScript для пользователей TypeScript, не переводя исходный код.
  • Вы хотите сравнить экспортируемый API модуля Flow с его эквивалентом на TypeScript.

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

  1. Вставьте модуль Flow в панель Flow.
  2. Он отправляется на /api/flow-to-typescript с установленным declarationOnly; сервер конвертирует его в TypeScript и генерирует объявления.
  3. Скопируйте результат из панели TypeScript Declarations в index.d.ts рядом с точкой входа вашего пакета.

Flow

// @flow
export type Point = { x: number, y: number };
export type Shape = 'circle' | 'square';
export type Label = ?string;
export const ORIGIN: Point = { x: 0, y: 0 };

export function distance(a: Point, b: Point = ORIGIN): number {
  return Math.hypot(a.x - b.x, a.y - b.y);
}

export class Canvas {
  shapes: Shape[] = [];
  draw(shape: Shape, at?: Point): void { this.shapes.push(shape); }
}

Объявления TypeScript (.d.ts)

export type Point = {
  x: number
  y: number
}
export type Shape = "circle" | "square"
export type Label = string | null | undefined
export declare const ORIGIN: Point
export declare function distance(a: Point, b?: Point): number
export declare class Canvas {
  shapes: Shape[]
  draw(shape: Shape, at?: Point): void
}

Подробности и ограничения

Страница отправляет ваши данные на серверный маршрут (/api/flow-to-typescript) для конвертации; они обрабатываются не только в браузере. API-маршруты Next.js по умолчанию принимают тело запроса размером до 1 МБ.

Загружаются библиотечные файлы ES2020 и DOM из TypeScript, поэтому Array<T>, Promise, Date и $ReadOnlyArray (конвертированный в ReadonlyArray) появляются в объявлениях так, как написаны.

Maybe-типы становятся T | null | undefined, как у Label в примере.

Компилируется только один файл; импортируемые типы не разрешаются.

FAQ

Сохраняются ли async-функции и типы возврата Promise?

Да. export async function load(id: number): Promise<Tag> становится export declare function load(id: number): Promise<Tag>.

Что происходит со значениями параметров по умолчанию?

Они удаляются, а параметр становится необязательным: b: Point = ORIGIN превращается в b?: Point.

Сохраняются ли псевдонимы типов?

Да. Экспортируемые псевдонимы типов выводятся в сконвертированной форме TypeScript. Страница форматирует результат через Prettier, поэтому в нём отступ в два пробела и нет точек с запятой.

Спецификации и справка