IT技术 - 如何在 React 项目中一起使用 Antdesign 和 tailwindcss - 吾爱随笔录

IT技术 css reactjs antd tailwind-css css-frameworks

2021-05-08 22:24:08

我要新建一个项目，想把这两个包放在一起，但不确定，所以问题是使用 Tailwindcss 和 antdesign 是一个好习惯吗？

有没有人有任何经验？

每个包都有自己的主题管理器，例如所有颜色、排版、暗模式等。您如何管理主题，使用顺风或 antd 或两者兼而有之？为什么？

这两个软件包都具有 Grid 功能，您更喜欢哪一个？

让我们有你的见解？

经过一番研究，我发现了这些结果

使用两个库的一些示例：

它建议尝试只Promise一个框架

3个回答

Tailwind CSS 和 Ant Design 一起使用没有问题。

Tailwind CSS 可用于在 Ant Design 组件上自定义样式。

检查此链接以查看 Next、Ant Design 和 Tailwind CSS 的示例：

您可以使用Bootstrap与ant design对不对？想想Tailwind同引导。Tailwind 是一个 CSS 库，您可以将它与任何设置和框架一起使用，无需额外配置。只需传递 Tailwind 类名称即可。

说到主题。这是一个上下文。Ant 设计将抓住它的上下文，顺风抓住它。我们不需要考虑或担心

同时使用 ant-design 和 tailwind-css 的一个小问题是 tailwind 的一些默认样式会破坏 ant-design 组件......

我最近遇到了一个问题，即 ant-design 图像预览无法正常运行且图像未居中。

预期结果图一

VS我使用顺风蚂蚁设计时得到了图像中的两个

结果 Tailwind 会将默认图像显示属性从“inline-block”更改为“block”，并破坏了 Tailwind 图像预览组件

我通过重置图像的显示属性解决了我的问题

img {
    display: unset !important;
}

除了这些小调整之外，您还可以同时使用它们

其它你可能感兴趣的问题