How do you format code in vscode?

In VSCode, formatting code is a straightforward process. VSCode offers multiple methods to help developers maintain clean and consistent code. Here are several common approaches:

1. Using Keyboard Shortcuts to Format Code

VSCode provides keyboard shortcuts for quick code formatting. For Windows and Linux users, use Shift + Alt + F. For Mac OS users, use Shift + Option + F. This will automatically format the currently open file.

2. Formatting Code via the Command Palette

You can also format code through the command palette. Simply press F1 or Ctrl + Shift + P (on Mac, Cmd + Shift + P) to open the command palette, then type "Format Document" and select this command. This will also format the current document.

3. Enabling Automatic Formatting on Save

VSCode allows you to configure automatic formatting when saving files. You can enable the "Editor: Format On Save" option by editing settings (open the settings interface, search for "format on save"). This ensures code is automatically formatted every time you save a file.

4. Using Specific Code Formatting Extensions

The VSCode community offers powerful code formatting extensions, such as Prettier and Beautify. After installing these extensions, you can leverage them for advanced formatting settings. For example, the Prettier extension enables customization of formatting rules by adding a .prettierrc file in the project root directory.

Example: Installing and Using Prettier

1. Open VSCode.
2. Navigate to the Extensions view (by clicking the square icon in the sidebar or pressing Ctrl + Shift + X).
3. Search for "Prettier" in the search bar and install it.
4. Configure the .prettierrc file (if needed).
5. Use the shortcut or command palette to format code, or enable "Format on Save".

By utilizing any of these methods, you can efficiently manage and maintain code formatting in VSCode, ensuring your code remains clear and maintainable.