使用css module时编译后的style中的类选择器名和dom中类名不一致导致样式不能生效

Question

使用css module时, 父组件会将子组件style的类选择器加上hash后缀, 但是html标签是原样, 导致子组件引用不到样式效果

比如header.vue中引用了子组件btn.vue.
子组件style中设置.class{background:red}, dom中设置:class="$style.class".

编译之后变成:

style中是: .class_???(hash后缀),

dom中是: class="class".

两者不匹配, 导致样式不能生效.

参考慕课网问题页: 慕课网问题页