React CSS工程化解决方案总结

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了React CSS工程化解决方案总结相关的知识,希望对你有一定的参考价值。

参考技术A 在工程化中,很重要的一点就是保持各组件名称的不同,对于css来说,这点尤为重要,为了不使诸多类似的样式名称混淆,一般都会使用css编译工具,对原来的名字进行统一修改替换,确保所有名字都不重叠。

默认react是直接将样式注入到页面,并没有对name进行处理,容易产生冲突,而官方没有提供具体的主流css集成方案,社区便产生了诸多解决方案,在此对不同的方案进行简要介绍和汇总。

具体使用:

具体使用:

结果

上述各种都各有优劣,按需使用即可

其他文章可以 参考

以上是关于React CSS工程化解决方案总结的主要内容,如果未能解决你的问题,请参考以下文章

前端工程构建总结

面试思路总结

create-react-app中css module无效的解决办法

React:CSS 指针事件的解决方法:IE9 中没有

react中css里面 class中的 图片的相对地址 完美解决 backgroundImage

CSS modules 与 React中实践