Tailwind CSS

Zed 内置支持 Tailwind CSS 的自动补全、代码检查和悬停预览。

• 语言服务器：tailwindlabs/tailwindcss-intellisense

配置

要配置 Tailwind CSS 语言服务器，请参阅扩展设置并将其添加到您的 settings.json 文件中的 lsp 部分。

{
  "lsp": {
    "tailwindcss-language-server": {
      "settings": {
        "classFunctions": ["cva", "cx"],
        "experimental": {
          "classRegex": ["[cls|className]\\s\\:\\=\\s\"([^\"]*)"]
        }
      }
    }
  }
}

Zed 中可与 Tailwind CSS 一起使用的语言

• Astro
• CSS
• ERB
• HEEx
• HTML
• TypeScript
• JavaScript
• PHP
• Svelte
• Vue

Prettier 插件

Zed 开箱即用支持 Prettier，这意味着如果您安装了 Tailwind CSS Prettier 插件，将其添加到您的 Prettier 配置中即可自动生效。

// .prettierrc
{
  "plugins": ["prettier-plugin-tailwindcss"]
}