原因:react中的css没有域的概念,是全局的,在Vue的工程中除了Modules之外还可以使用css作用域scoped来做实现组件之间的样式不会互相干扰,实现样式独立,所以需要css modules。

有很多方法可以解决这个问题,比如 css-in-js:

本文只讨论css modules的实现方式。

如果是create-react-app 来创建的项目:

1.npm run eject (显示设置文件,会看到script/ 与 config/文件夹)

如果出现:Remove untracked files, stash or commit any changes, and try again.

把git 提交一下就好了 git add .     git push   再执行就ok了

2、在config/目录下可以看到两个配置文件webpack.config.jswebpackDevServer.config.js。如果你需要配置所需的功能,可以在webpack.config.js中添加配置。如果你需要将项目打包输出的话,还得配置webpack.config.prod.js。具体如何配置,这里不说了。因为太复杂了。

先说明一下 Create React APP默认具备了CSS Modules的功能

这里就不探究了,

直接使用css  module,起名字的时候要加上module。引入的时候要用对象的方式使用就行了

Logo

前往低代码交流专区

更多推荐