在 PhpStorm 中保存时自动格式化 Blade 模板

PhpStorm 能够基于 PSR-2、PSR-12、Symfony、Laravel 等标准对 PHP 文件进行自动格式化。但是，直到最近，在 PhpStorm 中还没有太多选项可以一致地格式化 Blade 模板。有传言说 Blade 格式化功能即将加入 Laravel Pint，但另一个有趣的选项是使用 JavaScript 的 Prettier 代码格式化工具，以及 prettier-plugin-blade 插件。

Matt Stauffer 的文章 如何在 Laravel 应用中设置 Prettier，整理 Tailwind 类顺序等 是使用 Prettier 格式化 Tailwind 和 Blade 的一个很好的入门教程。

以下是 Prettier 配置文件的要点

{
  "plugins": ["prettier-plugin-blade", "prettier-plugin-tailwindcss"],
  "overrides": [
    {
      "files": [
        "*.blade.php"
      ],
      "options": {
        "parser": "blade"
      }
    }
  ]
}

配置好 Prettier 后，你可以通过导航到 **语言和框架 > JavaScript > Prettier**，快速在 PhpStorm 中设置保存时的格式化。更新你的设置以反映以下内容

具体来说，你需要将 blade.php 添加到“为文件运行”模式中。完整的模式应该是：**/*.{js,ts,jsx,tsx,vue,astro,blade.php}。确保选中了“保存时运行”，现在 Blade 文件会自动格式化。如果你已经启用了 prettier-plugin-tailwindcss 插件，Tailwind 类也会被排序！

如果你想手动重新格式化代码，也可以使用“重新格式化代码”操作（我的快捷键是 Alt+Super+l）来使用已配置的格式化程序格式化任何文件。

**相关：** Jeffrey Way 在 2024 年的 PhpStorm 设置