react中css作用模块化webpack配置
1、react中css模块化可通过配置webpack
类似于vue中css作用域有scoped指令作用组件内起作用,
css模块化只对class类名和id选择器,对标签不生效
css-loader之后可通过?追加参数,类似地址栏url参数形式
固定参数modules,表示普通css样式表,启用模块化
module:{
rules:[
{ test:/\.css/,use:['style-loader','css-loader?modules'] } //注意loader顺序 style (动态生成style标签)、css(处理css文件依赖关系)
]
}
2、模块化打包的效果
css文件中的属性名
import导入后输出的对象的属性名不在是空,而且有了变化