Code Formatting Shortcut:

Visual Studio Code on Windows - Shift + Alt + F

Visual Studio Code on MacOS - Shift + Option + F

Visual Studio Code on Ubuntu - Ctrl + Shift + I

You can also customize this shortcut using a preference setting if needed.

Code Formatting While Saving the File:

Visual Studio Code allows the user to customize the default settings.

If you want to auto format your content while saving, add the below code snippet in the work space settings of Visual Studio Code.

Menu File → Preferences → Workspace Settings

{
    // 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"
    ]
}

Note: now you can auto format TypeScript files. Check my update.

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" }

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

The right key combination is Shift + Alt + F.

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

On Linux it is Ctrl + Shift + I.

On Windows it is Alt + Shift + F. Tested with HTML/CSS/JavaScript and Visual Studio Code 1.18.0.

For other languages, you might need to install a specific language package.

For Fedora

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

Mine read "key": "ctrl+shift+i"

You can change it as well. Refer to this answer on how to... or if you are feeling a little lazy to scroll up:

You can add a keybinding in "Preferences->Keyboard shortcuts"

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

Or Visual Studio like:

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

Please note: cmd key is only for Macs. For Windows and Fedora (Windows keyboard) use Ctrl

EDIT:

As per Visual Code version 1.28.2 this is what I found.

editor.action.format no longer exists. It has now been replaced by editor.action.formatDocument and editor.action.formatSelection.

Type editor.action.format in the search box to view existing shortcuts.

To change the key combinations follow these steps:

1. Click editor.action.formatDocument or editor.action.formatSelection
2. A pen like icon appears to the left - click it.
3. A pop-up appears. Press the desired key combination and press enter.

On Ubuntu it's Ctrl + Shift + I.

Menu File → Preferences → Settings

"editor.formatOnType": true

When you enter the semicolon, it's going to be formatted.

Alternatively, you can also use "editor.formatOnSave": true.

Just right-click on the text and select "Format code".

Visual Studio Code uses js-beautify internally, but it lacks the ability to modify the style you wish to use. The extension "beautify" lets you add settings.

Shift + Alt + F does the job just fine in 1.17.2 and above.

For some reason Alt + Shift + F didn't work for me on Mac Visual Studio Code 1.3.1, and actually the command "Format Document" don't worked at all. But command Formatter worked very well.

So you can use Command + Shift + P and type Formatter or make your own shortcut in menu File → Preferences → Keyboard Shortcuts → Command + K Command + S then type Formatter and add your shortcut.

See an example:

Formatting code in Visual Studio.

I have tried to format in Windows 8.

Just follow the screenshots below.

1. Click on View on the top menu bar, and then click on Command Palette.

2. Then a textbox would appear where we need type Format

   Shift + Alt + F

In Visual Studio Code, Shift+Alt+F is doing what Ctrl+K+D is doing in Visual Studio.

The simplest way I use in Visual Studio Code (Ubuntu) is:

Select the text which you want to format with the mouse.

Right click and choose "Format selection".

On Mac, Shift + Alt + F works for me.

You can always check the key bindings in the menu:

Menu File → Preferences → Keyboard Shortcuts and filter by keyword 'format'.

The format shortcut in C# didn't work for me until I installed Mono for Mac OS X, DNVM and DNX.

Before I installed Mono, the auto-format shortcut (Shift + Alt + F) worked only for the .json files.

While changing the default behavior for Visual Studio Code requires an extension, you may override the default behavior in the workspace or user level. It works for most of the supported languages (I can guarantee HTML, JavaScript, and C#).

Workspace level

Benefits

• Does not require an extension
• Can be shared among teams

Outcomes

• .vscode/settings.json is created in the project root folder

How To?

1. Go to: Menu File → Preferences → Workspace Settings

2. Add and save "editor.formatOnType": true to settings.json (which overrides default behavior for the project you work on by creating .vscode/settings.json file).