webpack编译的sass文件，编译后classname变成乱码了，怎么回事？

Question

webpack编译的sass文件，编译后classname变成乱码了，怎么回事？

---下边是webpack的配置

------补充-------

刚才又试了一下，发现只有标签选择器没有变乱码，类选择器和id选择器都变成了乱码

Answer 1

css-loader?module

这里明显已经配置了css模块化, 类名和id变成随机串是为了保证只能某个模块范围内起作用.

另外你确定这么写能有用? 不是应该是 css-loader?modules 吗

https://github.com/webpack-co...

Answer 2

防止全局命名重复，对命名的处理方式之一。

和html的应该是匹配的。

Answer 3

因为你开启了css-loader的modules，会默认使用css的局部作用域化
在这种情况下如果要使用全局css，需要使用:global
像这样

:global(.classname) {
    /*...*/
}

ps: 虽然使用module配置也能兼容，但是按文档上的配置项应该是modules