V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
vevlins
V2EX  ›  前端开发

tailwindcss 和组件库怎么结合?

  •  
  •   vevlins · 2022-11-10 14:16:58 +08:00 · 2321 次点击
    这是一个创建于 743 天前的主题,其中的信息可能已经有所发展或是发生改变。

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

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

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

    6 条回复    2022-11-25 11:14:12 +08:00
    estk
        1
    estk  
       2022-11-10 14:27:58 +08:00 via Android   ❤️ 1
    gouflv
        2
    gouflv  
       2022-11-10 16:17:43 +08:00 via iPhone   ❤️ 1
    暂时没发现有效的方式,感觉 vue 的社区对这方面不感冒
    gouflv
        3
    gouflv  
       2022-11-10 16:35:35 +08:00 via iPhone
    https://github.com/element-plus/element-plus/issues/3076
    估计他们能把 less 一直撸到 vue4 :p
    baipiaoguai
        4
    baipiaoguai  
       2022-11-11 17:32:44 +08:00   ❤️ 1
    dssxzuxc
        5
    dssxzuxc  
       2022-11-17 13:16:21 +08:00
    这些组件库,确实没办法完美的使用原子 css ,特别是 vue 还得深度选择,我现在是能用原子 css 尽量用,ui 库的公共样式单独一个文件写,深度选择的样式另外写,原子 css 大概占了 70%
    baipiaoguai
        6
    baipiaoguai  
       2022-11-25 11:14:12 +08:00   ❤️ 1
    最近发现了新的工具库,让 tailwind 和组件库更好结合
    https://github.com/fgnass/classname-variants
    https://github.com/joe-bell/cva
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2808 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 14:10 · PVG 22:10 · LAX 06:10 · JFK 09:10
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.