在React开发中，大型项目中组件间的CSS冲突是个常见问题。本文介绍了两种避免冲突的方法：1) 使用CSS模块化，通过style.module.css来限制样式作用域；2) 引入styled-components，它允许在组件内部定义样式，避免全局污染。作者推荐使用styled-components，因为它提供更简洁的样式管理方式。
在用React框架开发会遇到这样的问题，当项目很大的时候会有很多独立的组件，即使每个组件都导入一个单独的css文件，也会发生样式冲突、重置等等问题，因为不像vue那样可以在style里面写scoped。那如何避免css冲突呢？我的解决方法有以下两种:
一，用module
1， 把css文件加上module ，如 style.module.css
2，在用的时候
二，使用styled-components （本人推荐）
1，安装npm i styled-components -s
2, 引入插件
3，创建一个样式文件styled_components.css,
================================================
扫一扫
到【灌水乐园】发言
