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

请问 mui 和 tailwind 正确使用方式是什么?

  •  
  •   lucifer518 · 285 天前 · 2151 次点击
    这是一个创建于 285 天前的主题,其中的信息可能已经有所发展或是发生改变。

    第一次写 React ,以前写 Vue 使用了 Vuetify ,material 组件+css 写起来很舒服

    然后换 React 直接就选了 mui+tailwindcss ,前面写着还行,一打包,css 冲突 tailwind 的 css 都失效了

    搜了一下,好像只能 tailwind 加前缀,但是这样写起来非常蛋疼

    请问有其他更好的方法吗?不然要换 NextUI 了

    8 条回复    2024-02-14 08:03:37 +08:00
    y2x33
        1
    y2x33  
       285 天前
    试试 uno 呢
    murmur
        2
    murmur  
       285 天前
    tailwind 适合手搓轮子,如果没折腾能力建议直接用带样式的组件库
    langziyang
        3
    langziyang  
       284 天前   ❤️ 1
    其实 MUI 写好了根本就不需要 tailwind,然后 MUI 也有结合 tailwind 的方法 https://mui.com/material-ui/integrations/interoperability/#tailwind-css
    bigdatahestudy
        4
    bigdatahestudy  
       284 天前   ❤️ 1
    mui 本身有自己的 css in js 方案,其实并不适合结合 tailwind 去写
    IvanLi127
        5
    IvanLi127  
       284 天前   ❤️ 1
    我用 twin.macro + mui ,好像没遇到什么问题。
    lucifer518
        6
    lucifer518  
    OP
       283 天前
    @langziyang #3 感谢,按照这文档的来行的通,但是还是有点问题,刷新的时候会闪一下,从无样式到有样式,我再看看能不能解决
    主要是觉得 tailwind 比 sx 写起来方便简洁一些,才用 mui+tailwind 的
    langziyang
        7
    langziyang  
       282 天前 via Android
    @lucifer518 是的,tailwindcss 也是极其方便,我刚开始也是想一切办法结合两者,现在我基本换到 sx 了,tailwindcss 也还是在用,有一些组件你还是可以用 className 写
    rocmax
        8
    rocmax  
       278 天前 via Android   ❤️ 1
    既然想用 tailwindcss ,组件库最好选择 headless 的,现在最流行的是 shadcn ui 。如果组件库内部包含了样式设定当然容易冲突。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5810 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 26ms · UTC 01:48 · PVG 09:48 · LAX 17:48 · JFK 20:48
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.