React CSS Module

在React中，通过import引入的CSS文件最终都会被插到HTML文件的head中，造成全局污染

CSS Module可以通过为类名加上哈希值的方式保证类名的唯一性

使用方式：

1. 创建类似于index.module.css的样式文件，正常编写CSS样式

2. 在组件中导入样式文件

import styles from'./index.module.css'

3. 使用对象的形式设置样式

<divclassName={styles.类名}>react</div>

4. 若不希望CSS Module修改类名可以使用:global()，一般在派生选择器中使用，父类名设置在组件的最外层保证唯一性，子类名不变

// index.module.css
// :global(.类名){}
.fater_element :global(.child_element) {}