tailwindcss 和组件库怎么结合？

[vevlins]

很多 tailwind 组件库都是直接提供 html 片段，不做任何封装，但他们提供的能力都很弱，感觉现在写起来都退回到原生年代了。

最好的应该是 headless/ui ，这种理念我觉得很好，但没找到其他类似的组件库。

平时常用的 element-plus dom 封装地比较深，我不知道该怎么跟 tailwind 结合，有什么好的最佳实践吗？

[estk]

vue 不熟，react mui 可以这样： https://coding3.com/archives/ReactJS-yarn-TS-CRACO-MUI-TailwindCSS.html

[gouflv]

暂时没发现有效的方式，感觉 vue 的社区对这方面不感冒

[gouflv]

https://github.com/element-plus/element-plus/issues/3076
估计他们能把 less 一直撸到 vue4 :p

[baipiaoguai]

我找了几圈，发现两个相对较好的:
https://github.com/vechai/vechaiui
https://github.com/creativetimofficial/material-tailwind?ref=material-tailwind

[dssxzuxc]

这些组件库，确实没办法完美的使用原子 css ，特别是 vue 还得深度选择，我现在是能用原子 css 尽量用，ui 库的公共样式单独一个文件写，深度选择的样式另外写，原子 css 大概占了 70%

[baipiaoguai]

最近发现了新的工具库，让 tailwind 和组件库更好结合
https://github.com/fgnass/classname-variants
https://github.com/joe-bell/cva