如果 React 项目仅作用于本地组件，为什么它会继承这个 css 模块作为它的背景？

Question

我创建了一个 React 组件，由于某种原因，整个网站继承了我放在一个 CSS 模块中的主体定义。我尝试过使用和不使用本地标签，我感觉这与如何反应打包 CSS 模块有关，因为我没有看到其他人有同样的问题。

:local body
{
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: #300d25;
    transition: 0.5s;
}
:local body::before
{
    content:'';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #30bfa5;
    transition: 0.5s;
    clip-path: circle(250px at center);
} 

Answer 1

您已经创建了一个带有关联 CSS 模块的 React 组件，但是您在其中一个 CSS 模块中定义的样式似乎影响了整个网站，而不仅仅是组件。此问题可能是由于 CSS 模块使用不正确、类名冲突、全局样式、拼写错误、浏览器扩展或 CSS 特异性问题造成的。为了解决这个问题，请确保正确的 CSS 模块命名和使用，检查冲突和拼写错误，检查全局样式，使用 CSS 重置或规范化，检查应用的样式，并验证您的 Webpack 配置。如果问题仍然存在，请考虑提供更多详细信息以进行特定的故障排除。