# Formatter de SCSS

Formate folhas de estilos SCSS de Sass com este Formatter de SCSS. Cole SCSS e a ferramenta organiza regras aninhadas, variáveis, mixins, includes, seletores pais e diretivas de controle com indentação de dois espaços, uma declaração por linha, um espaço após os dois-pontos das propriedades e ponto e vírgula onde estiver faltando. Interpolações e comentários são mantidos, para que desenvolvedores front-end possam organizar partials e trechos sem compilá-los.

## Perguntas frequentes

### Como funciona o Formatter de SCSS?

Ele lê a folha de estilos como tokens, como chaves, ponto e vírgula, dois-pontos, strings e comentários, e reconstrói a disposição a partir deles. Cada chave de abertura inicia um bloco indentado, e cada declaração termina em sua própria linha.

### Há suporte para aninhamento?

Sim, regras aninhadas e seletores pais como &:hover são indentados um nível a mais que o elemento pai, com dois espaços por nível. Os dois-pontos dos seletores permanecem junto deles, então &:hover não é dividido.

### Como variáveis, mixins e includes são formatados?

Variáveis como $color: #333; recebem um espaço após os dois-pontos, e @mixin e @include mantêm seus argumentos com um espaço após cada vírgula. Diretivas de controle como @if, @each e @for recebem um espaço antes do parêntese.

### As interpolações são preservadas?

Sim, interpolações como #{$name} são copiadas exatamente como foram escritas. Isso inclui interpolações dentro de seletores, como .icon-#{$name}, e dentro de nomes de propriedades.

### A ferramenta compila ou valida meu SCSS?

Não, ela não compila para CSS nem verifica a sintaxe, então também formata trechos incompletos. Use o compilador Sass para encontrar erros e gerar CSS.

### Os comentários são mantidos?

Sim. Comentários de linha iniciados por // terminam no fim da linha, e comentários de bloco são mantidos onde aparecem.

### Funciona com a sintaxe Sass indentada?

Não, ele foi desenvolvido para SCSS, que usa chaves e ponto e vírgula. Arquivos na sintaxe .sass indentada não têm chaves para servir de referência à indentação, então converta-os para SCSS primeiro.

### Posso mudar a indentação?

Não, a saída sempre usa dois espaços e o formatador não tem opções. Assim, a mesma folha de estilos sempre produz o mesmo resultado.

### Por que o resultado vem dentro de um bloco scss?

A saída é retornada como um bloco de código Markdown identificado como scss, para ser exibida com realce de sintaxe. Copie as linhas entre as cercas para o seu arquivo .scss.

### Qual pode ser o tamanho da minha folha de estilos?

Até 5 MB por execução; entradas maiores são rejeitadas com uma mensagem. A saída é idêntica à opção SCSS do Code Formatter.

Seu anúncio aqui?

[Envie-nos um e-mail](mailto:hi@dennn.is?subject=Publicidade%20em%20OneClick%20Pro)

[Anúncio O conjunto de plugins pronto para agentes para WordPress.](https://sleekwp.com/?ref=oneclickpro)