Converter Flow em JavaScript — Numio

Quando usar

• Você está removendo o Flow de um projeto e quer primeiro o JavaScript puro, antes de decidir se migra para TypeScript.
• Você precisa colar um trecho tipado com Flow em um lugar que só aceita JavaScript padrão, como o console do navegador ou um codepen.

Como usar

1. Cole código anotado com Flow (com ou sem o cabeçalho // @flow) no painel Flow.
2. O código é enviado para /api/flow-to-javascript, onde o recast o analisa com o parser do Flow e o Babel remove os tipos.
3. Copie o JavaScript do painel de saída.

// @flow
import type { Store } from './store';
import { createStore } from './store';

type State = { count: number };

export function first<T>(items: Array<T>): ?T {
  return items.length ? items[0] : null;
}

const store: Store<State> = createStore(({ count: 0 }: State));

export default store;

import { createStore } from "./store"

export function first(items) {
  return items.length ? items[0] : null
}

const store = createStore({
  count: 0,
})

export default store

Detalhes e limitações

A página envia sua entrada para uma rota do servidor (/api/flow-to-javascript) para conversão; ela não é processada apenas no navegador. As rotas de API do Next.js aceitam por padrão corpos de requisição de até 1 MB.

Só os tipos são removidos. Sintaxe moderna como JSX, ?? ou campos de classe não é transpilada.

O resultado é reformatado com Prettier (aspas duplas, sem ponto e vírgula), então o estilo original não é mantido, e um type cast como ({ count: 0 }: State) perde os parênteses extras.

Um comentário // @flow anexado a uma declaração de tipo removida é removido junto com ela.

FAQ

Ferramentas relacionadas

Especificações e referências

• @babel/plugin-transform-flow-strip-types