react 中开启css-modules
css-modules开启作用
css拥有局部作用域,放在css污染
webpack中改造
{
loader:'css-loader',
options: {
modules: {
localIdentName: "[path][name]__[local]",
},
}
}
代码中修改 index.jsx
// 引入方式修改
// import './index.scss';
import style from './index.scss';
// 使用方式
classNmae={style.XXX}
css/scss 中局部不编译 global
// 添加局部
:global(.focused){ // 样式名称
background-color: pink; // 样式内容
}