vscodeprettier配置（vscode配置rem）

## VSCode Prettier 配置指南### 简介Prettier 是一款广受欢迎的代码格式化工具，它能够自动格式化你的代码，使其风格统一、易于阅读。VSCode Prettier 插件将 Prettier 集成到 VSCode 中，让你在保存代码时自动格式化代码。### 配置 Prettier#### 1. 安装插件在 VSCode 扩展商店中搜索 "Prettier - Code formatter" 并安装。#### 2. 创建配置文件为了更好地控制 Prettier 的行为，建议创建一个配置文件。你可以在项目根目录下创建以下配置文件：

`.prettierrc`: JSON 格式

`.prettierrc.json`: JSON 格式

`.prettierrc.yaml`: YAML 格式

`.prettierrc.yml`: YAML 格式

`.prettierrc.js`: JavaScript 格式

`prettier.config.js`: JavaScript 格式#### 3. 配置选项Prettier 提供了丰富的配置选项，你可以在配置文件中设置这些选项，例如：```json {"printWidth": 80, // 每行最大字符数"tabWidth": 2, // 一个制表符等于多少个空格"useTabs": false, // 使用空格代替制表符"semi": true, // 语句末尾添加分号"singleQuote": true, // 使用单引号"trailingComma": "es5", // 对象、数组添加尾逗号"bracketSpacing": true, // 对象字面量括号内添加空格"jsxBracketSameLine": false, // 将 > 符号放在多行 JSX 元素的最后一行"arrowParens": "avoid" // 尽可能省略箭头函数参数的括号 } ```你可以在 [Prettier 官方文档](https://prettier.io/docs/en/options.html) 中找到所有可用的配置选项。#### 4. 使用 EditorConfig如果你已经在使用 EditorConfig，Prettier 可以读取 EditorConfig 文件中的部分配置项，例如 `indent_style`、`indent_size` 和 `max_line_length`。#### 5. 在 VSCode 中配置你也可以在 VSCode 设置中配置 Prettier，打开 "设置" (Ctrl+, 或 Cmd+,), 搜索 "Prettier", 然后修改相关设置。### 使用 Prettier#### 1. 格式化整个文档

使用快捷键：`Shift + Alt + F` (Windows) 或 `Shift + Option + F` (Mac)

右键点击编辑器，选择 "格式化文档"#### 2. 格式化选中代码

选中要格式化的代码

使用快捷键：`Ctrl + Shift + P` (Windows) 或 `Command + Shift + P` (Mac)

输入 "Format Selection With..."，选择 "Prettier - Code formatter"#### 3. 保存时自动格式化在 VSCode 设置中搜索 "Format On Save" 并勾选，即可在保存文件时自动格式化代码。### 总结通过以上步骤，你就可以在 VSCode 中轻松配置和使用 Prettier，让你的代码更加规范、易读。

VSCode Prettier 配置指南

简介Prettier 是一款广受欢迎的代码格式化工具，它能够自动格式化你的代码，使其风格统一、易于阅读。VSCode Prettier 插件将 Prettier 集成到 VSCode 中，让你在保存代码时自动格式化代码。

配置 Prettier

1. 安装插件在 VSCode 扩展商店中搜索 "Prettier - Code formatter" 并安装。

2. 创建配置文件为了更好地控制 Prettier 的行为，建议创建一个配置文件。你可以在项目根目录下创建以下配置文件：* `.prettierrc`: JSON 格式 * `.prettierrc.json`: JSON 格式 * `.prettierrc.yaml`: YAML 格式 * `.prettierrc.yml`: YAML 格式 * `.prettierrc.js`: JavaScript 格式 * `prettier.config.js`: JavaScript 格式

3. 配置选项Prettier 提供了丰富的配置选项，你可以在配置文件中设置这些选项，例如：```json {"printWidth": 80, // 每行最大字符数"tabWidth": 2, // 一个制表符等于多少个空格"useTabs": false, // 使用空格代替制表符"semi": true, // 语句末尾添加分号"singleQuote": true, // 使用单引号"trailingComma": "es5", // 对象、数组添加尾逗号"bracketSpacing": true, // 对象字面量括号内添加空格"jsxBracketSameLine": false, // 将 > 符号放在多行 JSX 元素的最后一行"arrowParens": "avoid" // 尽可能省略箭头函数参数的括号 } ```你可以在 [Prettier 官方文档](https://prettier.io/docs/en/options.html) 中找到所有可用的配置选项。

4. 使用 EditorConfig如果你已经在使用 EditorConfig，Prettier 可以读取 EditorConfig 文件中的部分配置项，例如 `indent_style`、`indent_size` 和 `max_line_length`。

5. 在 VSCode 中配置你也可以在 VSCode 设置中配置 Prettier，打开 "设置" (Ctrl+, 或 Cmd+,), 搜索 "Prettier", 然后修改相关设置。

使用 Prettier

1. 格式化整个文档* 使用快捷键：`Shift + Alt + F` (Windows) 或 `Shift + Option + F` (Mac) * 右键点击编辑器，选择 "格式化文档"

2. 格式化选中代码* 选中要格式化的代码 * 使用快捷键：`Ctrl + Shift + P` (Windows) 或 `Command + Shift + P` (Mac) * 输入 "Format Selection With..."，选择 "Prettier - Code formatter"

3. 保存时自动格式化在 VSCode 设置中搜索 "Format On Save" 并勾选，即可在保存文件时自动格式化代码。

总结通过以上步骤，你就可以在 VSCode 中轻松配置和使用 Prettier，让你的代码更加规范、易读。