Pular para o conteúdo

Formatador Flow

Formate código JavaScript tipado com Flow usando este formatador Flow. Cole código com aliases de tipo, tipos de objeto exatos, funções anotadas ou a pragma @flow, e a ferramenta o reorganiza token por token, com recuo de dois espaços, espaçamento em anotações de tipo e operadores, ponto e vírgula no fim das instruções e chaves justas para objetos exatos. Útil para desenvolvedores que mantêm bases de código Flow e querem trechos organizados para revisões, migrações e documentação.

Redefinir

Perguntas frequentes

Como funciona o formatador Flow?

Ele divide seu código em tokens, como chaves, ponto e vírgula, operadores, strings e comentários, e reconstrói a disposição a partir deles. Os blocos recebem recuo de dois espaços, as instruções terminam com ponto e vírgula e os operadores recebem espaçamento consistente.

Como os tipos de objeto exatos são formatados?

Nos tipos de objeto exatos, as barras ficam encostadas às chaves, com um espaço por dentro. Por exemplo: type Props = {| name: string, age: number |}. Os espaços após os dois-pontos e as vírgulas dentro do tipo são normalizados.

O comentário @flow é mantido?

Sim, a pragma // @flow e todos os outros comentários de linha e de bloco são preservados. Um comentário de linha sempre encerra sua linha, então o código seguinte começa em uma nova linha.

O formatador verifica os tipos do meu código?

Não, ele não executa Flow nem valida a sintaxe, então também formata trechos incompletos. Execute flow check no seu projeto para encontrar erros de tipo.

Genéricos e parâmetros de tipo são preservados?

Sim, os sinais de menor e maior em tipos como Array<string> ou Map<K, V> são identificados para não serem confundidos com operadores de comparação. O espaçamento após as vírgulas dentro deles é normalizado.

Posso alterar a largura do recuo?

Não, a saída sempre usa dois espaços e não há opções de estilo. Isso mantém a formatação consistente entre execuções e entre membros da equipe.

As strings são alteradas?

Não, literais de string, literais de modelo e expressões regulares são copiados exatamente como foram escritos. Apenas os espaços em branco entre os tokens são alterados.

Por que a saída está entre cercas de código javascript?

Flow é tipado como JavaScript, então o resultado é retornado como um bloco de código Markdown identificado como javascript, que a maioria dos realçadores de sintaxe renderiza corretamente. Copie as linhas entre as cercas para o seu arquivo .js ou .flow.

A formatação vai mudar o que meu código faz?

A ferramenta apenas reorganiza os espaços em branco e adiciona ponto e vírgula ao final das instruções. Confira o resultado se o seu código depender de linhas sem ponto e vírgula que começam com parênteses ou colchetes.

Quanto código posso formatar?

Até 5 MB de código por execução; entradas maiores são rejeitadas com uma mensagem. O resultado é idêntico à opção Flow do Code Formatter.

Sobre OneClick Pro

OneClick Pro é uma coleção gratuita com mais de 150 ferramentas da Web para o trabalho cotidiano: converter imagens e unidades, formatar e validar código, verificar domínios e SEO, e trabalhar com textos, datas e números. Todas as ferramentas funcionam sem registro ou assinatura, e o que você digita é usado apenas para calcular o resultado e nunca é armazenado. Use o serviço como uma caixa de ferramentas para tarefas pontuais ou salve nos favoritos as ferramentas que você usa todos os dias.