TailwindCSS 的使用与反应中的样式组件混淆
Usage of TailwindCSS messes with styled components in react
我遇到的问题简单说明了。我作为前端开发人员在一个项目上工作，并使用 react with styled-components 来做到这一点。我的同事使用 TailwindCSS。现在我试图将它们合并在一起，但似乎每当我激活 Tailwind 和我的拼贴画的组件时，它都会稍微弄乱我的样式组件，所以它们看起来不合时宜，即使他没有处理这些文件并且从未做过他们里面的任何东西。有没有我遗漏或应该寻找的东西？
提前致谢。
我不知道你们是如何合作的，但将样式化组件与 tailwind 集成的正确方法是使用 attr 函数添加样式
const Card = styled.div.attrs({ className: "bg-white mx-auto max-w-sm shadow-lg rounded-lg" })` ["Your styles and props"]`;
//and even extend later
<Card className="overflow-hidden">Content</Card>
否则，一些顺风全局样式会影响您不希望它发生的组件（这可能是您遇到的情况）。
我遇到的问题简单说明了。我作为前端开发人员在一个项目上工作，并使用 react with styled-components 来做到这一点。我的同事使用 TailwindCSS。现在我试图将它们合并在一起，但似乎每当我激活 Tailwind 和我的拼贴画的组件时，它都会稍微弄乱我的样式组件，所以它们看起来不合时宜，即使他没有处理这些文件并且从未做过他们里面的任何东西。有没有我遗漏或应该寻找的东西？
提前致谢。
我不知道你们是如何合作的，但将样式化组件与 tailwind 集成的正确方法是使用 attr 函数添加样式
const Card = styled.div.attrs({ className: "bg-white mx-auto max-w-sm shadow-lg rounded-lg" })` ["Your styles and props"]`;
//and even extend later
<Card className="overflow-hidden">Content</Card>
否则，一些顺风全局样式会影响您不希望它发生的组件（这可能是您遇到的情况）。