我引入了一个样式文件,里面定义了.container
的样式,然后使用 parcel 运行,发现样式不起作用。
我配置了 postcss:
{
"modules": true,
"plugins": {
"autoprefixer": {
"grid": true
},
"precss": {}
}
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="./style.css">
<title>test</title>
</head>
<body>
<div class="container">
<div class="box"></div>
</div>
<script src="./index.js"></script>
</body>
</html>
经过排查后发现,我页面当中的class名是.container
,经过parcel 编译转换后的 css 文件中,原来 .container
的名字,被转换成了:._container_uquia_5
,因为class名都不一样了,当然样式就不生效了,请问这要怎么办?
我把postcss的配置去掉就正常了。
css-modules 文档在这里: https://github.com/css-module...
通过使用
:global
让类名保持不变。