请问parcel怎么使用css样式？

我引入了一个样式文件，里面定义了.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的配置去掉就正常了。

parcel

阅读 4k

4 个回答

得票最新

小弟调调

8.3k31125

发布于
2019-04-03

✓ 已被采纳

css-modules 文档在这里： https://github.com/css-module...

通过使用 :global 让类名保持不变。

:global {
  .md-editor {
    color: red;
  }
}

具体没有在parcel中使用过postcss，所以建议你看看着篇文章，postcss

如果问题还是没有得到解决，建议询问该文章作者，嘻嘻~

查看全部 4 个回答