Prettier 如何配置格式化多个扩展名的文件？

Prettier 可以通过配置文件来指定需要格式化的文件扩展名。以下是几种不同方式来配置 Prettier 以格式化多个扩展名的文件：

1. 命令行界面（CLI）

   在命令行中使用 Prettier 时，可以通过通配符指定要格式化的文件。例如：

   bash
   prettier --write '**/*.{js,jsx,ts,tsx,css,md}'

   这将格式化项目中所有的 .js, .jsx, .ts, .tsx, .css, 和 .md 文件。

2. Prettier 配置文件

   创建一个 .prettierrc 文件或在 package.json 中添加一个 prettier 字段，然而这两种方式本身并不直接支持指定文件扩展名，Prettier 配置文件主要用于指定代码风格选项。

3. 使用 .prettierignore 文件

   创建 .prettierignore 文件来忽略不需要格式化的文件和文件夹。这不是直接指定格式化哪些扩展名的文件，而是排除不想格式化的文件。例如：

   plaintext
   # 忽略 node_modules 文件夹
   node_modules
   
   # 忽略所有的 HTML 文件
   *.html
   
   # 忽略指定的 CSS 文件
   ignore-this.css

4. 使用 package.json 脚本

   在 package.json 中设置一个脚本来运行 Prettier 并格式化指定扩展名的文件：

   json
   {
     "scripts": {
       "format": "prettier --write '**/*.{js,jsx,ts,tsx,css,md}'"
     }
   }

   然后，你可以通过运行 npm run format 或 yarn format 来格式化所有指定扩展名的文件。

5. 编辑器集成

   大多数现代代码编辑器（如 Visual Studio Code）都支持 Prettier 插件，该插件可以自动格式化保存时更改的文件。在编辑器的设置中，你通常可以指定哪些文件类型应该在保存时被格式化。

   例如，在 Visual Studio Code 中，你可以在设置（settings.json）中添加以下配置：

   json
   "editor.formatOnSave": true,
   "[javascript]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   "[javascriptreact]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   "[typescript]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   "[typescriptreact]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   "[css]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   "[markdown]": {
     "editor.defaultFormatter": "esbenp.prettier-vscode"
   },
   // ... 其他扩展名

   这样，当你保存文件时，Prettier 就会自动格式化支持的扩展名的文件。