umi项目中遇到的样式覆盖问题

在umi项目中,作者遇到了使用自定义主题后,antd组件样式覆盖问题。对比配置文件和搜索解决方案无效,最终发现是第三方组件导入了全局antd.css导致。解决方案包括:让组件负责人修正导入路径,自己修改第三方组件代码,或者使用patch-package工具避免样式冲突。
摘要由CSDN通过智能技术生成

描述下我项目上遇到的样式覆盖问题:

我在该项目上使用了umi主题定制的配置,修改了一些公共变量的值,包括primary-color等,但是经过编译后发现修改过的主题色总会被antd组件原有的样式覆盖。如图所示:

因为该项目是从其他项目迁移过来的,但是其他项目编译并不会出现这种问题。

所以我的第一个解决思路就是看他们配置是否有不一致的地方,但是我对比过许多配置文件,重新进行编译后发现,都没能解决。

于是我开始在网上进行各种搜索,希望可以找到一点解决思路。终于,我在官网上看到了解决思路。

​​​​​​​

 因为项目上没有使用babel-plugin-import这个插件,所以考虑应该是导入antd.css样式导致的样式覆盖问题。

最后发现确实是被引入的第三方的一个组件影响的,这个组件直接导入了 antd/dist/antd.min.css ,导致了样式覆盖问题。

这里解决可以引入less文件或者限制作用域

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值