1. 概述
Visual Studio Code（以下简称VS Code）是一款免费开源的文本和代码编辑器，非常受开发者欢迎。在编写代码的过程中，我们可能会遇到需要保存并格式化代码的情况。本文将介绍如何通过配置来实现VS Code保存时自动格式化代码的功能。
2. 安装插件
Vscode默认不支持自动格式化代码，因此我们需要借助插件来实现这一功能。有很多插件可以实现自动格式化代码，比如Prettier、ESLint等。在本文中我们选择使用Prettier插件。
在VS Code左侧的侧边栏中点击“扩展”图标（可用快捷键Ctrl+Shift+X打开），然后在搜索框中输入“Prettier”进行搜索。找到Prettier插件后，点击“安装”按钮进行安装。
3. 配置Prettier插件
3.1 打开设置
在VS Code中打开“文件”菜单，选择“首选项”→“设置”（可用快捷键Ctrl+，打开）。在弹出的设置界面中，找到“用户”或“工作区”选项卡（根据个人需求选择），然后点击“打开设置(JSON)”按钮。
3.2 配置Prettier插件
在打开的设置文件中，添加以下配置项：
```json
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true
```
配置项解释：
editor.defaultFormatter：指定默认的代码格式化器为Prettier。
editor.formatOnSave：设置为true时，保存文件时将自动格式化代码。
3.3 高级配置（可选）
除了基本的配置之外，您还可以根据个人需要进行一些高级配置。比如，您可以配置Prettier的其他选项，如缩进字符数、换行符等。
在设置文件中添加以下配置项：
```json
"prettier.tabWidth": 2,
"prettier.printWidth": 80,
"prettier.trailingComma": "none",
"prettier.singleQuote": true,
"prettier.jsxSingleQuote": false,
"prettier.useTabs": false,
"prettier.semi": true,
"prettier.arrowParens": "avoid"
```
以上配置项仅为示例，您可以根据自己的需要进行修改。
4. 使用示例
完成上述配置后，每次保存文件时VS Code将自动格式化代码。下面我们通过一个简单的示例来演示如何实现。
假设我们有一个JavaScript文件，内容如下：
```javascript
function sayHello(name) {
console.log("Hello, " + name);
}
```
当我们保存文件时，Prettier插件会自动将代码格式化为：
```javascript
function sayHello(name) {
console.log("Hello, " + name);
}
```
可以看到，代码被正确地缩进和对齐，使得代码更易于阅读。
5. 总结
通过配置VS Code以使用Prettier插件，我们可以实现保存时自动格式化代码的功能，使得代码风格统一，并提高代码的可读性。同时，VS Code的插件生态系统非常丰富，还有许多其他插件可以满足不同开发需求。希望本文对您有所帮助，祝您编码愉快！