Merge pull request #28097 from lkxed/20221127-1-How-to-Automatically-Indent-Your-Code-in-Visual-Studio-Code

[手动选题][tech]: 20221127.1 ⭐️ How to Automatically Indent Your Code in Visual Studio Code.md

sources/tech/20221127.1 ⭐️ How to Automatically Indent Your Code in Visual Studio Code.md

@@ -0,0 +1,95 @@
+[#]: subject: "How to Automatically Indent Your Code in Visual Studio Code"
+[#]: via: "https://itsfoss.com/auto-indent-vs-code/"
+[#]: author: "Sagar Sharma https://itsfoss.com/author/sagar/"
+[#]: collector: "lkxed"
+[#]: translator: " "
+[#]: reviewer: " "
+[#]: publisher: " "
+[#]: url: " "
+
+How to Automatically Indent Your Code in Visual Studio Code
+======
+
+The indent in code refers to the space you have at the beginning of the code line. Like other code editors and IDEs, VS Code allows you to indent your code automatically.
+
+You can set tabs or spaces or whatever you prefer for the indentation.
+
+Sounds good? Let’s see how to do it.
+
+### Enable automatic indent in VS Code
+
+There are multiple ways you can achieve this. In this guide, I will show you three ways to indent your code in visual studio code automatically.
+
+#### Method 1: Configuring global user settings
+
+You can access the global user settings via the command pallet. Use `Ctrl + Shift + P` to open the command pallet and search for `Open User Settings` and hit enter:
+
+![access user setting from command pallet in vscode][1]
+
+It will open up the settings. From there, you will have to search for `Auto Indent` and choose **Full** as an indent option in **Editor: Auto Indent**:
+
+![enable auto indent from global user settings in vscode][2]
+
+And the automatic indent is enabled and applied to every opened file in VSCode.
+
+#### Method 2: Using linter or formatter for automatic indent in VS Code
+
+In this method, you will be required to add extensions such as a code formatter or linter to have the desired results. 
+
+Linters will identify the errors in code, whereas formatters will only format your code to make it more readable. You can search for code formatters in the [VSCode marketplace][3] specific to your programming language.
+
+And here are some of my favorite code formatters and linters for widely popular languages:
+
+- [C/C++][4]: For C and C++ programming language.
+- [PHP][5]: For PHP.
+- [markdownlint][6]: For markdown files.
+- [Python][7]: For Python programming language.
+- [ESLint][8]: For JSON and javascript.
+- [Beautify][9]: For javascript, JSON, CSS, Sass, and HTML.
+
+Once you are done adding a formatter for your preferred programming language, you can press `Ctrl _ Shift + I` to format the code.
+
+Similarly, you can use do the same using the command pallet. Press `Ctrl + Shift + P` to and search for **Format document**, and hit enter.
+
+![indent code in VSCode][10]
+
+#### Method 3: Enable auto indent while saving the file
+
+VSCode allows you to format your code while saving it with a little tweak. Let me show you how.
+
+Press `Ctrl + ,` and it will open the user settings prompt. From there, search for **Format On Save**:
+
+![enable format on save option][11]
+
+ And from now on, your files will add an indent automatically when you save them.
+
+### Wrapping Up
+
+In this guide, I explained how you can add an indent automatically in VSCode. I would recommend using the second method for better flexibility.
+
+I hope you will find this guide helpful and if you have any queries or suggestions, let me know in the comments. 
+
+--------------------------------------------------------------------------------
+
+via: https://itsfoss.com/auto-indent-vs-code/
+
+作者：[Sagar Sharma][a]
+选题：[lkxed][b]
+译者：[译者ID](https://github.com/译者ID)
+校对：[校对者ID](https://github.com/校对者ID)
+
+本文由 [LCTT](https://github.com/LCTT/TranslateProject) 原创编译，[Linux中国](https://linux.cn/) 荣誉推出
+
+[a]: https://itsfoss.com/author/sagar/
+[b]: https://github.com/lkxed
+[1]: https://itsfoss.com/wp-content/uploads/2022/11/access-user-setting-from-command-pallet-in-vscode.png
+[2]: https://itsfoss.com/wp-content/uploads/2022/11/enable-auto-indent-from-global-user-settings-in-vscode.png
+[3]: https://marketplace.visualstudio.com/vscode
+[4]: https://marketplace.visualstudio.com/items?itemName=ms-vscode.cpptools
+[5]: https://marketplace.visualstudio.com/items?itemName=DEVSENSE.phptools-vscode
+[6]: https://marketplace.visualstudio.com/items?itemName=DavidAnson.vscode-markdownlint
+[7]: https://marketplace.visualstudio.com/items?itemName=ms-python.python
+[8]: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
+[9]: https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify
+[10]: https://itsfoss.com/wp-content/uploads/2022/11/format-document-.gif
+[11]: https://itsfoss.com/wp-content/uploads/2022/11/enable-format-on-save-option.png