避免 css id 和类变量名称在项目中发生冲突

Question

除了确保你的类和id变量名称每次都以不同的方式命名之外(在React/wepback项目冲突/影响另一个CSS类或另一个文件中的ID中没有类或ID名的最佳方法是什么？

例如：

file.js有一个带有 id 或类名的div，称为container。 我在整个项目中有多个 css 文件，一些 css 文件(超过 1 个(中.container变量。

如果我不想记住以不同的方式命名变量，我如何确保在网络打包/捆绑/npm 开始时这些不会冲突？

谢谢

Answer 1

您可以使用 CSS 模块来避免 css 文件中的名称冲突。通过使用它可以本地化选择器名称。

CSS

模块是一个 CSS 文件，其中包含所有类名和动画 默认情况下，名称的范围在本地。

此外，如果你想要全局选择器，你可以遵循语法。

:global(.myclass){}