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

Конвертировать TypeScript в типы Flow — Numio

Преобразует объявления типов TypeScript в типы Flow с помощью flowgen. readonly становится маркером вариантности +, экспортируемые функции и классы — "declare export", а enum — точными объектами только для чтения.

Вы публикуете библиотеку на TypeScript и хотите также поставлять определения Flow для пользователей Flow.

TypeScript

Flow

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

  • Вы публикуете библиотеку на TypeScript и хотите также поставлять определения Flow для пользователей Flow.
  • Кодовая база на Flow зависит от пакета, у которого есть только типы .d.ts, и нужен libdef в качестве отправной точки.

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

  1. Вставьте объявления TypeScript (интерфейсы, типы, инструкции declare, enum) или модуль с кодом реализации в панель TypeScript.
  2. Код отправляется на /api/typescript-to-flow. Код с телами функций или инициализаторами сначала сводится компилятором TypeScript к .d.ts; затем flowgen конвертирует и форматирует его.
  3. Скопируйте результат Flow, поместите его в папку flow-typed или файл .js.flow и запустите flow для проверки.

TypeScript

export type Theme = "light" | "dark";

export interface ButtonProps {
  label: string;
  theme?: Theme;
  readonly disabled: boolean;
  onClick(event: MouseEvent): void;
}

export declare function render(props: ButtonProps): string;
export enum Size { Small, Large }

Flow

export type Theme = "light" | "dark";
export interface ButtonProps {
  label: string;
  theme?: Theme;
  +disabled: boolean;
  onClick(event: MouseEvent): void;
}
declare export function render(props: ButtonProps): string;

declare export var Size: {|
  +Small: 0, // 0
  +Large: 1, // 1
|};

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

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

Код реализации сначала компилируется в объявления, поэтому остаётся только его типизированный API: тела исчезают, выведенные типы возврата подставляются, а неэкспортируемые значения, которые не использует ни один экспорт, отбрасываются.

Псевдонимы объектных типов становятся неточными объектами Flow, оканчивающимися на "..."; интерфейсы остаются интерфейсами.

Числовые enum становятся объявленным точным объектом из литеральных значений только для чтения, например +Small: 0.

FAQ

Как конвертируются свойства readonly?

readonly disabled: boolean становится +disabled: boolean — маркером ковариантного (только для чтения) свойства во Flow.

Можно ли вставить целый файл .ts с реализациями?

Да. Сервер сначала генерирует объявления, поэтому нетипизированная стрелочная функция получает выведенный тип, например declare export var greet: (u: User) => string. О синтаксических ошибках сообщается вместо конвертации.

Поддерживаются ли enum TypeScript?

Да, в виде declare export var Name: {| +Member: value |}. Flow enum не генерируются.

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