How to use Prettier in VS Code shortcut key?

在 Visual Studio Code (VS Code) 中使用 Prettier 来格式化代码是一个提高编码效率的好方法。要通过快捷键执行 Prettier 格式化，你可以遵循以下步骤：

安装 Prettier 插件

首先，确保你已经在 VS Code 中安装了 Prettier 插件。可以通过以下步骤来安装：

1. 打开 VS Code。
2. 转到侧边栏的扩展视图，可以通过点击左侧的方块图标或使用快捷键 Ctrl+Shift+X 打开。
3. 在搜索框中输入“Prettier - Code formatter”。
4. 找到插件后，点击“安装”。

设置快捷键

安装完插件后，下一步是设置一个快捷键来执行代码格式化：

1. 打开命令面板，可以使用快捷键 Ctrl+Shift+P (Windows/Linux) 或 Cmd+Shift+P (Mac)。

2. 输入“Open Keyboard Shortcuts (JSON)”并选择该命令。这将打开一个 JSON 文件，你可以在这里自定义快捷键。

3. 在打开的 keybindings.json 文件中，你需要添加一条如下的配置：

   json
   {
       "key": "ctrl+alt+f",  // 这里可以自定义你想要的快捷键组合
       "command": "editor.action.formatDocument",
       "when": "editorHasDocumentFormattingProvider && editorTextFocus && !editorReadonly"
   }

   上面的配置中，"ctrl+alt+f" 是设置的快捷键，你可以根据自己的习惯修改。"editor.action.formatDocument" 是执行格式化的命令。

使用快捷键格式化代码

设置好快捷键后，你就可以在编辑器中打开一个文件，然后按你设定的快捷键，Prettier 将自动格式化你的代码。这在编写 JavaScript, CSS, HTML 等文件时特别有用，能够迅速地整理代码风格，保持一致性。

举个例子： 假设你在编写一个 JavaScript 文件，并且代码缩进、空格等使用的不是很规范。你只需按下 ctrl+alt+f（或你自定义的其他快捷键），Prettier 将自动调整这些格式，使代码看起来更整洁、更易于阅读。

以上就是通过 VS Code 使用 Prettier 插件并设置快捷键来格式化代码的方法。这种方式可以极大提升你的代码质量和工作效率。