从 TailwindCSS 2 升级到 3 后,一些 类 例如旋转和缩放(已知的两个)停止工作

Some classes such as rotate and scale (the known two) stopped working after upgrading from TailwindCSS 2 to 3

我昨天在 TailwindCSS 中尝试使用新引入的 arbitrary value,我突然想到我需要从版本 2 升级到最新版本。我虔诚地遵循了升级指南,一切似乎都在工作,直到我意识到我站点中的 scalerotate 已停止工作。苦战了一夜,没有运气。

我有另一个最初使用 TailwindCSS 版本 3 的 NextJS 项目,我在其上尝试了 scalerotate,并且运行良好。与当前版本 (3.X.23) 相比,该版本有点低 (3.X.4),所以我降级到那个版本,但缩放和旋转不起作用。

我现在很沮丧,因为我不知道自己没有做什么或做错了什么。有人可以救救吗?

哈哈!!!我想通了!

实际上,我使用的是自定义 类 而不是个人实用程序 类,这意味着我不一定需要将 @tailwind base 导入我的 globals.css。

我意识到每当我导入 @tailwind base 时,scalerotate 开始工作,但我的其他一些样式是杂乱无章的(因为基本样式 over-write 我的风格)。所以,为了让它工作,我在这里读到 https://tailwindcss.com/docs/preflight 可以通过添加

来禁用 tailwind.config.js 文件中的预设
corePlugins: {
preflight: false,

},