Jak formatować kod w programie Visual Studio Code (VSCode)

Skrót Formatowania Kodu:

VSCode on Windows - Shift + Alt + F

VSCode na MacOS - Shift + opcja + F

VSCode na Ubuntu - Ctrl + Shift + I

W razie potrzeby można również dostosować ten skrót za pomocą ustawienia preferencji.

Formatowanie kodu podczas zapisywania pliku:

Visual Studio code pozwala użytkownikowi dostosować domyślne ustawienia.

Jeśli chcesz automatycznie sformatować zawartość podczas zapisywania, dodaj poniższy fragment kodu w Ustawieniach przestrzeni roboczej programu visual studio code.

File -- > Preferences --> Workspace Settings

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

   "editor.formatOnSave": true,

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

Uwaga: teraz możesz automatycznie formatować pliki maszynopisu sprawdź moją aktualizację

Możesz dodać skrót klawiszowy w File --> Preferences --> Keyboard shortcuts.

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

Lub Visual Studio Jak:

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

Odpowiednia kombinacja klawiszy to shift+alt+f

Zauważ również, że od dziś formatowanie jest dostępne dla tych języków:

• xml (usunęli , za dużo błędów)
• html
• json
• javascript
• maszynopis
• c #

VS Code 1.6.1 obsługuje format " przy zapisie ", który automatycznie pobiera odpowiednie zainstalowane rozszerzenia formatera i formatuje cały dokument przy każdym zapisie.

Włącz opcję "Formatuj przy zapisie" przez ustawienie

"editor.formatOnSave": true

I są dostępne skróty klawiaturowe (VS kod 1.7 i powyżej): {]}

Sformatuj cały dokument: Shift + Alt + F

Tylko Wybór formatu: CtrlK + CtrlF

Na Linuksie Ctrl + Shift + I . W Systemie Windows Alt + Shift + F . Testowane z HTML / CSS / JS i VsCode 1.18.0.

W przypadku innych języków może być konieczne zainstalowanie określonego pakietu językowego.

1. Kliknij prawym przyciskiem myszy plik
2. Wybierz Format dokumentu ( Alt + shift + f ) z menu.

Na ubuntu to Ctrl + Shift + i

Wystarczy kliknąć prawym przyciskiem myszy na tekst i wybrać "format kodu".

VS Code używa wewnętrznie js-beautify, ale brakuje mu możliwości modyfikacji stylu, którego chcesz użyć. Rozszerzenie "beautify" pozwala dodać ustawienia

Z jakiegoś powodu Alt + Shift + F nie działa dla mnie na Mac VSC 1.3.1, właściwie polecenie "Format dokumentu" nie działa w ogóle. Ale command Formatter działał bardzo dobrze.

Więc możesz użyć polecenia + Shift + P i wpisz Formatter lub stwórz własny skrót w poleceniu Preferences / Keyboard Shortcuts + K dowództwo + S Następnie wpisz Formatter i dodaj swój Skrót zobacz przykład:

Dla Fedory

1. kliknij File -> Preferences -> Keyboard shortcuts.
2. Under Default Keyboard Shortcuts, search ( Ctrl + F ) dla editor.action.format.

Moje przeczytane "key": "ctrl+shift+i"

Możesz dodać skrót klawiszowy w "Preferencje- > skróty klawiaturowe"

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

Lub Visual Studio Jak:

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

Uwaga: cmd klucz jest tylko dla komputerów Mac. Dla Windows i Fedory (Klawiatura Windows) użyj Ctrl

Shift + Alt + f działa dobrze w wersji 1.17.2 i nowszej.

On Visual Studio Code, Shift+Alt+F robi to co Ctrl+K+D robi w Visual Studio.

Na Macu Shift+Alt+F działa dla mnie.

Zawsze możesz sprawdzić wiązania klawiszy w menu:
Code -> Preferences -> Keyboard Shortcuts i filtruj według słowa kluczowego "format".

Skrót formatu w C# nie działał u mnie dopóki nie zainstalowałem Mono dla Mac OS X, DNVM i DNX. Przed zainstalowaniem mono, Skrót auto-format (Shift + Alt + F ) działa tylko dla plików .json.

Podczas gdy zmiana domyślnego zachowania Visual Studio Code wymaga rozszerzenia, możesz zastąpić domyślne zachowanie w obszarze roboczym lub na poziomie użytkownika i działa dla większości obsługiwanych języków (mogę zagwarantować html, javascript, c#)

Poziom przestrzeni roboczej

Korzyści

• nie wymaga rozszerzenia
• może być dzielony pomiędzy zespół

Wyniki

• .vscode/settings.json jest tworzony w korzeniu projektu folder

Jak?

1. Przejdź do: File -- > Preferences --> Workspace Settings

2. Dodaj i zapisz "editor.formatOnType": true do ustawień.json (który nadpisuje domyślne zachowanie dla projektu, nad którym pracujesz, tworząc .vscode / settings.plik json).

Poziom środowiska użytkownika

Korzyści

• nie wymaga rozszerzenia
• środowisko rozwoju osobistego them all (settings:))

Wyniki

W 2007 roku firma została założona przez firmę Microsoft.]}

Jak?

1. Przejdź do: Plik -- > Preferencje -- > Ustawienia użytkownika

2. Dodaj lub zmień wartość "editor.formatOnType": false na "editor.formatOnType": true w ustawieniach użytkownika.json

Lokalizacja użytkownika Visual Studio Code settings.json to:

Ustawienia lokalizacji plików w zależności od Twojego Platforma, ustawienia użytkownika plik znajduje się tutaj:

Windows % APPDATA% \ Code \ User \ settings.JSON Mac $HOME / Library / Application Support / Code/User / settings.JSON Linux $HOME/.config / Code / User / settings.json plik ustawienia przestrzeni roboczej jest znajduje się pod ... folder vscode w Twoim projekcie.

Więcej szczegółów można znaleźć tutaj

Formatowanie kodu w Visual Studio.

Mam spróbować sformatować w Windows 8.

Po prostu śledź zrzuty ekranu.

Krok 1. kliknij Widok na górnym pasku menu, a następnie kliknij polecenie Pallete.

1. wtedy pojawi się Textbox gdzie potrzebujemy wpisać Format

Shift + alt + f

File - > Preferences - > Settings

"editor.formatOnType": true

Kiedy wpiszesz średnik, zostanie on sformatowany

Wystarczy zainstalować Visual Studio Keymap firmy Microsoft. Problem Rozwiązany. : P

Zaznacz tekst, kliknij prawym przyciskiem myszy na zaznaczenie i wybierz opcję "paleta poleceń"

Otworzy się nowe okno, wyszukaj "format" i wybierz opcję, która ma formatowanie zgodnie z wymaganiami.

Domyślnie ten klucz nie działał dla mnie na dokumencie HTML, CSS, JS.

Po przeszukaniu znalazłem ten popularny plugin JS-CSS-HTML Formatter z 133,796 instaluje po instalacji wystarczy przeładować windows i wcisnąć CTRL + SHIFT + F i zadziałało!

W Mac, użyj ⌘+K i wtedy ⌘+F .

Trzeba najpierw zainstalować odpowiednią Wtyczkę (np. XML, C#, itd.). Formatowanie nie będzie dostępne, dopóki nie zainstalujesz odpowiedniej wtyczki i nie zapiszesz pliku z odpowiednim rozszerzeniem.

Najprostszy sposób, którego używam w VSCode (ubuntu) to:

Zaznacz tekst, który chcesz sformatować myszką .

Right click i wybierz "format selection"

Nie ten, użyj tego: File -- > Preferences --> Workspace Settings "redaktor.formatOnType": true

Dla tych, którzy chcą dostosować pliki JavaScript do formatowania, możesz użyć dowolnego rozszerzenia na właściwości JSfiles to samo dotyczy HTML.

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

To umożliwi upiększanie przy zapisie do maszynopisu, możesz dodać w XML do opcji HTML.

Jeśli chcesz dostosować styl dokumentu format, powinieneś użyć rozszerzenia Beautify .

Zobacz ten zrzut ekranu:

Użyj rozszerzenia..

Włącza automatyczne formatowanie kodu podczas zapisywania pliku.

Launch VS Code Szybkie otwieranie ( Ctrl + P ), wklej następujące polecenie i naciśnij enter.

Ext install format-on-save

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

Visual Studio Code LINUX:

Ctrl+[ do unindent bloku kodu i

Ctrl+] Aby zrobić wcięcie masowe