某些组件上的 Tailwind CSS 类不起作用答案

【问题标题】：Tailwind CSS classes on some components don't work某些组件上的 Tailwind CSS 类不起作用
【发布时间】：2021-08-02 13:18:12
【问题描述】：

我有一个使用 NextJS 和 ReactJS 创建的项目。我已经安装了 Tailwind CSS 并在位于“组件”文件夹中的一些组件中使用。

我在同一个“组件”文件夹中又创建了一个组件，名为“Thumbnail.js”。我想在“缩略图”内的 p 标签中使用h-2 truncate p-2。它们对组件没有任何影响。甚至在 Chrome 调试器中都看不到这些类名。

在我使用过transform hover:scale 的同一个“缩略图”组件中，有趣的是它有效。

这是存储库链接。 github.com/hakankaan/movie

【问题讨论】：

不看你的回购。 truncate 在 flexbox 里面吗？我假设 h-2 p-2 按预期工作
不，截断不在 flex 中。 h-2 p-2 给了 img 标签，并且这个 img 标签有一个 flex 父级。
奇怪的行为。我测试了你的 repo，h-2，p-2，truncate 可以毫无问题地应用于 p 标签。您是否尝试过删除 node_modules & lock 文件并重新安装？
@MicFung 谢谢。简单地解决了问题。
请参阅stackoverflow.com/help/how-to-ask。回购链接是不够的。

【解决方案1】：

删除 node_modules 和锁定文件并重新安装它解决了我的问题。

【讨论】：