为什么升级到 v4？

Tailwind CSS v4 放弃了 tailwind.config.js，改用 @theme {} CSS 块直接在 CSS 文件中定义主题变量，构建速度提升 5 倍以上。

主要变化

  • 配置文件从 JS 迁移到 CSS @theme {}
  • 插件系统改为 @plugin 指令
  • 部分工具类命名变更

迁移步骤

  1. 安装 @tailwindcss/vite
  2. 删除 tailwind.config.js，将颜色配置写入 CSS
  3. 运行官方迁移工具 npx @tailwindcss/upgrade