Como você formata o código ao salvar no VS Code

185

Gostaria de formatar automaticamente o código TypeScript usando o formatador incorporado ao salvar um arquivo no Visual Studio Code.

Estou ciente das seguintes opções, mas nenhuma delas é boa o suficiente:

Formate manualmente Shift + Alt + F
Formato no tipo "editor.formatOnType": true
- Ele formata a linha quando você pressiona enter. Infelizmente, ele não é formatado quando você clica em outra linha ou pressiona a seta para cima / para baixo.
Usar extensão existente
- Eu tentei este um , mas não parecem funcionar muito bem.
Use embelezar "beautify.onSave": true
- Não funciona com TypeScript
Gravar extensão personalizada
- É complicado se você deseja lidar com salvamentos automáticos e compilações corretamente.

visual-studio-code vscode-settings code-formatting

— Tomas Nikodym
fonte

279

A partir de setembro de 2016 (VSCode 1.6), isso agora é oficialmente suportado .

Adicione o seguinte ao seu settings.jsonarquivo:

"editor.formatOnSave": true

— Tomas Nikodym
fonte

5

existe uma maneira de excluir alguns arquivos? ou seja, eu quero apenas formatar arquivos .js e não arquivos .html.

— gabrielAnzaldo

@ gabodev77prettier no VS Code tem opções para isso (por exemplo, prettier.javascriptEnable, prettier.cssEnable ...) embora não seja para HTML.

— Freewalker 28/09

7

Ele pode formatar no Salvamento automático? formatOnSave está funcionando para mim somente quando eu clico manualmente em Cmd + S.

— Freewalker 28/09

@gabrielAnzaldo Veja esta pergunta para saber como excluir determinados arquivos / tipos de arquivo: stackoverflow.com/questions/44831313/…

— Gama11 30/03/19

@LukeWilliams No momento, isso não é possível, há uma solicitação de recurso aqui: github.com/microsoft/vscode/issues/45997

— Gama11

63

Para formatar automaticamente o código ao salvar:

Pressione Ctrl ,para abrir as preferências do usuário
Digite o seguinte código no arquivo de configurações aberto
```
{
    "editor.formatOnSave": true
}
```
Salvar Arquivo

Fonte

— Zameer
fonte

33

Se você deseja formatar automaticamente o salvamento apenas com fonte Javascript, adicione este em Users Setting(pressione Cmd,ou Ctrl,):

"[javascript]": { "editor.formatOnSave": true }

— Long Nguyen
fonte

a minha versão, eu comecei a procurar "formatOnSave" e só tinha de clicar em uma caixa de seleção em Configurações UI Código Vs

— Akin Hwan

24

Não há mais necessidade de adicionar comandos. Para quem é novo no Visual Studio Code e procura uma maneira fácil de formatar o código ao salvar, siga as etapas abaixo.

Abra as Configurações pressionando [Cmd+,]no Mac ou usando a captura de tela abaixo.

Digite ' format ' na caixa de pesquisa e ative a opção ' Format On Save '.

Você terminou. Obrigado.

— Balasubramani M
fonte

4

Para usuário MAC , adicione esta linha às suas configurações padrão

O caminho do arquivo é: / Usuários / USER_NAME / Biblioteca / Suporte a aplicativos / Código / Usuário / settings.json

"tslint.autoFixOnSave": true

A amostra do arquivo seria:

{
    "window.zoomLevel": 0,
    "workbench.iconTheme": "vscode-icons",
    "typescript.check.tscVersion": false,
    "vsicons.projectDetection.disableDetect": true,
    "typescript.updateImportsOnFileMove.enabled": "always",
    "eslint.autoFixOnSave": true,
    "tslint.autoFixOnSave": true
}

— Richard
fonte