ReactJS:Tailwind覆盖全局CSS内联

Question

我有这个rails reactjs应用程序，如果我把这行放在格式中

<input type='submit'/>

它将为我创建一个蓝色按钮。我刚刚安装了顺风，如果我用顺风类输入这行，它对按钮设计没有任何影响。

<input type='submit'
className='bg-red-500  text-white font-bold py-2 px-4 rounded-full'/>

有没有一种方法可以覆盖这个全局设置，比如放置！className中的重要内联？

如有任何帮助，我们将不胜感激。

Answer 1

您可以添加一个！类名前的字符，这应该完成的工作

示例：

<input type='submit'
className='!bg-red-500  text-white font-bold py-2 px-4 rounded-full'/>

文档：https://v2.tailwindcss.com/docs/just-in-time-mode#built-在重要的修改中

Answer 2

是的，如果添加此，则可以配置tailwind.config.js

module.exports = {
important: true,
}

这将生成所有tailwind类作为!important

点击此处阅读更多