kutombawewe.net

Come si formatta il codice in Visual Studio Code (VSCode)

Qual è l'equivalente di Ctrl + K + F e Ctrl + K + D su Windows in Visual Studio per la formattazione o il codice "abbellimento" nell'editor di codice di Visual Studio?

990
Brandon Clapp

La formattazione del codice è disponibile in Visual Studio Code tramite le seguenti scorciatoie:

  • Su Windows Shift + Alt + F
  • Su Mac Shift + Option + F
  • Su Ubuntu Ctrl + Shift + I

In alternativa, puoi trovare il collegamento, oltre ad altre scorciatoie, attraverso la funzionalità di ricerca fornita nell'editor Ctrl +ShiftP (o Command + Shift + P su Mac), quindi cercando il formato documento .

2974
Brandon Clapp

Code Formatting Shortcut:

Codice di Visual Studio su Windows - Shift + Alt + F

Codice di Visual Studio su MacOS - Shift + Option + F

Codice di Visual Studio su Ubuntu - Ctrl + Shift + I

È inoltre possibile personalizzare questo collegamento utilizzando un'impostazione delle preferenze, se necessario.

Formattazione del codice durante il salvataggio del file:

Codice di Visual Studio consente all'utente di personalizzare le impostazioni predefinite.

Se si desidera formattare automaticamente i contenuti durante il salvataggio, aggiungere lo snippet di codice seguente nelle impostazioni dello spazio di lavoro di Visual Studio Code.

Menu File Preferenze Impostazioni dell'area di lavoro

{
    // Controls if the editor should automatically format the line after typing
    "beautify.onSave": true,

    "editor.formatOnSave": true,

    // You can auto format any files based on the file extensions type.
    "beautify.JSfiles": [
        "js",
        "json",
        "jsbeautifyrc",
        "jshintrc",
        "ts"
    ]
}

Nota: ora è possibile formattare automaticamente i file TypeScript. Controlla il mio aggiornamento.

412

Puoi aggiungere una combinazione di tasti nel menu File Preferenze Tastiera scorciatoie.

{ "key": "cmd+k cmd+d", "command": "editor.action.formatDocument" }

Oppure Visual Studio like:

{ "key": "ctrl+k ctrl+d", "command": "editor.action.formatDocument" }
195
hardkoded

La combinazione di tasti giusta è Shift + Alt + F.

112
César
  1. Fare clic con il tasto destro sul file
  2. Seleziona Formato documento (Alt + Shift + F) dalla casella del menu.

Enter image description here

80
Siddarth Kanted

Si noti inoltre che da oggi la formattazione è disponibile per queste lingue:

  • XML (loro rimossi , troppi bug)
  • HTML
  • JSON
  • JavaScript
  • Dattiloscritto
  • C #
69
Johannes Rieken

Su Linux lo è Ctrl + Shift + I.

Su Windows lo è Alt + Shift + F. Testato con HTML/CSS/JavaScript e Visual Studio Code 1.18.0.

Per altre lingue, potrebbe essere necessario installare un pacchetto linguistico specifico.

59

Per Fedora

  1. Fare clic su File -> Preferences -> Keyboard shortcuts.
  2. Sotto Default Keyboard Shortcuts, ricerca (Ctrl + F) per editor.action.format.

Leggi il mio "key": "ctrl+shift+i"

Puoi anche cambiarlo. Fai riferimento a questa risposta su come ... o se ti senti un po 'pigro per scorrere su:


Puoi aggiungere una combinazione di tasti in "Preferenze-> Scorciatoie da tastiera"

{ "key": "cmd+k cmd+d", "command": "editor.action.format" }

Oppure Visual Studio come:

{ "key": "ctrl+k ctrl+d", "command": "editor.action.format" }


Notare che: cmd la chiave è solo per i Mac. Uso per Windows e Fedora (tastiera Windows) Ctrl


EDIT:

Come per la versione del codice visivo 1.28.2 questo è quello che ho trovato.

editor.action.format non esiste più. Ora è stato sostituito da editor.action.formatDocument e editor.action.formatSelection.

Digita editor.action.format nella casella di ricerca per visualizzare le scorciatoie esistenti.

Per cambiare le combinazioni di tasti segui questi passaggi:

  1. Fai clic su editor.action.formatDocument o editor.action.formatSelection
  2. A sinistra appare un'icona simile a una penna: fai clic su di essa.
  3. Viene visualizzata una finestra popup. Premere la combinazione di tasti desiderata e premere invio.
59
abyshukla

Codice di Visual Studio 1.6.1 supporta " Format On Save " che raccoglierà automaticamente le estensioni installate rilevanti del formatter e formatterà l'intero documento su ogni salvataggio.

Abilitare "Format On Save" impostando

"editor.formatOnSave": true

E ci sono scorciatoie da tastiera disponibili (Visual Studio Code 1.7 e sopra):

Formatta l'intero documentoShift + Alt + F

solo selezione formatoCtrl + KCtrl + F

55
Dariusz

Su Ubuntu è Ctrl + Shift + I.

41
ranbuch

Basta fare clic destro sul testo e selezionare "Formato codice".

Visual Studio Code utilizza internamente js-beautify, ma non ha la possibilità di modificare lo stile che si desidera utilizzare. L'estensione "abbellire" ti consente di aggiungere impostazioni.

27
Gerfried

Per qualche ragione Alt + Shift + F non ha funzionato per me su Mac Visual Studio Code 1.3.1, e in realtà il comando "Format Document" non ha funzionato affatto. Ma il comando Formatter ha funzionato molto bene.

Quindi puoi usare Command + Shift + P e digita Formatter o crea il tuo scorciatoia nel menu File Preferenze Tasti di scelta rapida → Command + KCommand + S quindi digita Formatter e aggiungi il collegamento.

Guarda un esempio:

Enter image description here

24

Shift + Alt + F fa il lavoro bene in 1.17.2 e oltre.

22
Piotrek Hryciuk

Il collegamento al formato in C # non ha funzionato per me finché non ho installato Mono per Mac OS X, DNVM e DNX .

Prima di installare Mono, il collegamento in formato automatico (Shift + Alt + F) ha funzionato solo per i file .json.

17
Jo Smo

Nel codice di Visual Studio, Shift+Alt+F sta facendo cosa Ctrl+K+D sta facendo in Visual Studio.

17
Burk

Su Mac, Shift + Alt + F per me va bene.

Puoi sempre controllare i collegamenti dei tasti nel menu:

Menu FilePreferenzeTasti di scelta rapida e filtro per parola chiave 'formato'.

14

Formattazione del codice in Visual Studio.

Ho provato a formattare in Windows 8.

Segui semplicemente gli screenshot qui sotto.

  1. Fare clic su Visualizza nella barra dei menu in alto, quindi fare clic su Tavolozza comandi.

    Enter image description here

  2. Quindi apparirà una casella di testo dove è necessario digitare Format

    Shift + Alt + F

    Enter image description here

14
afeef

Mentre la modifica del comportamento predefinito per Visual Studio Code richiede un'estensione, è possibile sovrascrivere il comportamento predefinito nell'area di lavoro o nel livello utente. Funziona per la maggior parte delle lingue supportate (posso garantire HTML, JavaScript e C #).

Livello di spazio di lavoro

Benefici

  • Non richiede un'estensione
  • Può essere condiviso tra le squadre

Risultati

  • .vscode/settings.json è stato creato nella cartella principale del progetto

Come?

  1. Vai a: Menu FilePreferenzeImpostazioni area di lavoro

  2. Aggiungi e salva "editor.formatOnType": true a settings.json (che sovrascrive il comportamento predefinito per il progetto su cui lavori creando il file .vscode/settings.json).

     How it looks

Livello di ambiente dell'utente

Benefici

  • Non richiede estensione
  • Ambiente di sviluppo personale tweeking per domarli tutti (impostazioni :))

Risultati

  • settings.json dell'utente is modificato (vedi posizione dal sistema operativo in basso)

Come?

  1. Vai a: menu FilePreferenzeImpostazioni utente

  2. Aggiungi o modifica il valore di "editor.formatOnType": false a "editor.formatOnType": true nelle impostazioni utente.json

La posizione settings.json dell'utente del codice di Visual Studio è:

Posizioni dei file delle impostazioni a seconda della piattaforma, il file delle impostazioni utente si trova qui:

  • Windows: %APPDATA%\Code\User\settings.json
  • Mac: $HOME/Library/Application Support/Code/User/settings.json
  • Linux: $HOME/.config/Code/User/settings.json Il file di impostazione dello spazio di lavoro si trova nella cartella .vscode del progetto.

Maggiori dettagli possono essere trovati qui .

11

L'impostazione predefinita per questa chiave non funzionava per me su documenti HTML, CSS e JavaScript.

Dopo la ricerca, ho trovato il popolare plugin JS-CSS-HTML Formatter con 133,796 installazioni .

Dopo l'installazione è sufficiente ricaricare le finestre e premere Ctrl + Shift + Fe ha funzionato!

8
mumair

Menu File Preferenze Impostazioni

"editor.formatOnType": true

Quando inserisci il punto e virgola, verrà formattato.

7
M Fatih Koca

Seleziona il testo, fai clic con il tasto destro sulla selezione e seleziona l'opzione "tavolozza comandi":

 Enter image description here

Si apre una nuova finestra. Cerca "format" e seleziona l'opzione che ha formattazione secondo il requisito.

6
Akhil Ghatiki

In Mac, usa +K e poi +F.

6
Gopal Devra

Basta installare Visual Studio Keymap di Microsoft. Problema risolto. : p

6
Rudy

Se vuoi personalizzare lo stile del formato-documento, devi usare Abbellisci estensione.

Fare riferimento a questo screenshot:

img

5
Jerry Ni

Non questo. Usa questo:

Menu File Preferenze Impostazioni area di lavoro , "editor.formatOnType" : true

4
杨恩锋

È necessario installare prima il plug-in appropriato (ad es., XML, C #, ecc.).

La formattazione non sarà disponibile fino a quando non avrai installato il plugin pertinente e salvato il file con un'estensione appropriata.

4
Nigel Feasey

Il modo più semplice che utilizzo in Visual Studio Code (Ubuntu) è:

Seleziona il testo che vuoi formattare con il mouse.

Fare clic con il tasto destro e scegliere "Selezione formato" .

4
Ashutosh Jha

Per coloro che desiderano personalizzare i file JavaScript da formattare, è possibile utilizzare any extension sulla proprietà JSfiles. Lo stesso vale per HTML.

{
    "beautify.onSave": true,
    "beautify.JSfiles": ["js", "json", "jsbeautifyrc", "jshintrc", "ts"],
    "beautify.HTMLfiles": ["htm", "html"]
}

Questo abiliterà l'abbellimento al salvataggio di TypeScript, ed è possibile aggiungere in XML all'opzione HTML.

3
Rick

Codice di Visual Studio su Linux:

Ctrl + [ al blocco di codice non indentato e

Ctrl + ] fare una rientranza di massa

1
Hvitis

Usa estensione ...

Abilita la formattazione automatica del codice quando si salva un file.

Avvia Visual Studio Code e Quick Open (Ctrl + P), incollare il seguente comando e premere Enter.

ext install format-on-save

https://marketplace.visualstudio.com/items?itemName=gyuha.format-on-save

0
Gyuha Shin