如何在 VSCode 中使用 Prettier - JavaScript

Prettier 是一款可以自动格式化你的 JavaScript 代码的工具，它可以帮助开发者便捷地写出格式优美、易读的代码。在本文中，我们将介绍如何在 Visual Studio Code 中使用 Prettier。

步骤一：安装 Prettier

在 VS Code 的扩展中心中搜索并安装 Prettier，或者在终端中使用以下命令行安装：

npm install -D prettier

步骤二：配置 Prettier

在 VS Code 的用户配置中添加以下选项，即可将 Prettier 集成到编辑器中：

"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
}

这些选项将使 VS Code 在保存文件时自动运行 Prettier，并且将 Prettier 设置为默认的代码格式化程序。

步骤三：使用 Prettier

现在，当你在保存 JavaScript 文件时，VS Code 将自动运行 Prettier 以格式化代码。

此外，你还可以使用以下快捷键手动运行 Prettier：

• Windows/Linux：Shift + Alt + F
• macOS：Shift + Option + F

步骤四：自定义配置

如果你想自定义 Prettier 的配置选项，可以在项目根目录下创建一个名称为 .prettierrc 的文件，并添加你需要的配置选项。例如：

{
  "semi": false,
  "singleQuote": true
}

这将禁用分号并且使用单引号代替双引号。

总结

以上就是在 VS Code 中使用 Prettier 的方法。通过配置 VS Code，我们可以让 Prettier 自动格式化我们的代码，为我们省去大量的手动调整代码格式的时间。