样式即使在JS文件中不导入css文件也可以工作

Question

我有一个create-react-app项目。在src文件夹，我导入index.css到index.js文件全局样式。除此之外，我还为每条路由准备了多个css文件。但我担心的是其他css文件的样式工作，即使我没有在项目的任何地方导入它们。我想知道不导入它们是否安全?

Answer 1

在一个组件上导入'.css'不会只为该组件封装。css。React将所有CSS代码转换成一个文件，然后输出它。这可能会导致您的代码在覆盖其他文件的css的情况下出现问题。

可以为每个组件指定一个className。例如,

<div className="componentone"> </div>

然后在CSS中做

.componentone p {...}

防止发生覆盖