How do you format code in Visual Studio Code (VSCode)

Answer 1

Just install Visual Studio Keymap (Visual Studio Keymap for Visual Studio Code) by Microsoft. Problem Solved. :p

Answer 2

You can add a keybinding in menu File → Preferences → Keyboard shortcuts.

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

Or Visual Studio like:

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

Answer 3

The code formatting is available in Visual Studio Code through the following shortcuts:

• On Windows Shift + Alt + F
• On Mac Shift + Option + F
• On Linux Ctrl + Shift + I

Alternatively, you can find the shortcut, as well as other shortcuts, through the 'Command Palette' provided in the editor with Ctrl +Shift+ P (or Command + Shift + P on Mac), and then searching for format document.

For unsaved snippets

1. Open command palette (Win: F1 or Ctrt+Shift+P)

2. Find 'Change Language Model'

3. Select language e.g. json. By now syntax should be highlighted.

4. Format document (e.g. Open Command Palette -> 'Format Document')

Unformat

1. Select text
2. Command Palette -> Join Lines

'Show the pics'

Answer 4

Visual Studio Code 1.6.1 supports "Format On Save" which will automatically pick up relevant installed formatter extensions and format the whole document on each save.

Enable "Format On Save" by setting

"editor.formatOnSave": true

And there are available keyboard shortcuts (Visual Studio Code 1.7 and above):

Format the whole document: Shift + Alt + F

Format Selection only: Ctrl + K, Ctrl + F

Answer 5

1. Right click somewhere in the content area (text) for the file
2. Select Format Document from the menu:
   • Windows: Alt Shift F
   • Linux: Alt Shift I
   • macOS: ⌥ ⇧ F

Answer 6

If you want to custom the style of format-document, you should use Beautify extention.

Refer to this screenshot: