Perguntas Frequentes

Prettier Config Generator é uma ferramenta web interativa gratuita que permite configurar visualmente cada opção do Prettier e copiar instantaneamente o arquivo .prettierrc resultante.

Prettier é um formatador de código opinativo que aplica um estilo consistente em toda a base de código, eliminando debates de estilo nas revisões.

Um arquivo .prettierrc é um arquivo de configuração na raiz do projeto que diz ao Prettier como formatar o código.

Selecione as opções do Prettier na página principal. A configuração atualiza em tempo real. Clique em "Copiar Configuração" e cole o JSON em um arquivo .prettierrc.

Sim, completamente gratuito. Sem cadastro, sem conta necessária, sem limites de uso.

Sim. Inclui cada opção oficialmente suportada com descrições e valores padrão.

Clique no botão "Copiar Configuração" na barra lateral ou no botão flutuante no mobile.

Os três são métodos válidos. .prettierrc suporta JSON/YAML, prettier.config.js é um módulo JavaScript, e a chave prettier no package.json mantém tudo em um arquivo.

Sim. Possui suporte integrado para TypeScript, JSX/TSX, componentes Vue e muito mais.

Instale a extensão "Prettier - Code formatter" e adicione formatOnSave: true nas configurações do VS Code.

Execute npx prettier --write . na raiz do projeto.

JavaScript, TypeScript, JSX, CSS, HTML, Vue, JSON, YAML, Markdown e mais.

Crie um arquivo .prettierignore na raiz do projeto.

Sim. Instale eslint-config-prettier.

printWidth define o comprimento de linha alvo. Padrão é 80.

singleQuote controla aspas em JS/TS, jsxSingleQuote controla atributos JSX.

Use a barra de pesquisa no topo da página.

Sim. Clique no botão de tema no cabeçalho.

printWidth: 80, tabWidth: 2, semi: true, singleQuote: false, trailingComma: "all".

Abra uma issue ou pull request no repositório do GitHub.

Você pode escolher qualquer release do Prettier 3.x no menu de versões — da 3.0 à 3.6 mais "latest". O bundle da versão selecionada é carregado sob demanda pelo jsDelivr, então a lista de opções sempre reflete o esquema real daquela release.

TypeScript, JavaScript, Flow, CSS, SCSS, Less, HTML, Vue, templates Angular, JSON, JSON5, JSON com comentários, Markdown, MDX, YAML e GraphQL. O parser é detectado automaticamente a partir da entrada, mas você pode forçar outro pelo menu suspenso.

Clique no botão de compartilhar e a versão atual do Prettier, as opções selecionadas, o código e o parser escolhido são comprimidos com LZ no hash da URL e copiados para a área de transferência. Abrir esse link restaura exatamente a mesma configuração. Nada é enviado para um servidor — tudo fica no navegador.

Ela mostra quantos tokens de IA sua entrada e saída custariam no modelo selecionado. GPT-4o / GPT-4 / GPT-3.5 usam os tokenizadores BPE oficiais para uma contagem exata; Claude, Gemini, Llama e Mistral usam uma aproximação baseada em caracteres prefixada por "~".

Sim. Sua versão do Prettier, as opções selecionadas e as preferências de visualização dividida / tokenizador são salvas no localStorage, então recarregar restaura tudo. Um hash de URL compartilhável tem precedência se estiver presente ao abrir a página.

Quando o parser do Prettier não consegue analisar sua entrada — geralmente porque o parser escolhido não corresponde ao código (ex.: CSS selecionado mas você colou JSX) — a mensagem de erro aparece em uma faixa vermelha acima do diff. Troque o parser para combinar com seu código e o erro desaparece.

Sim. A aba Preview tem seu próprio dropdown de parser ao lado do toggle do diff, e cada parser vem com uma amostra feita sob medida — CSS, SCSS, Less, HTML, Vue, Angular, JSON / JSON5 / JSONC, Markdown, MDX, YAML, GraphQL, além de TypeScript / JS. Trocar de parser re-formata a amostra correspondente com suas opções atuais, assim opções específicas de linguagem como proseWrap, htmlWhitespaceSensitivity e vueIndentScriptAndStyle têm um lugar para demonstrar seu efeito. Sua escolha persiste entre recarregamentos.