> 文章列表 > CSS模块postcss-modules,在jsx中实现vue里的scoped

CSS模块postcss-modules,在jsx中实现vue里的scoped

CSS模块postcss-modules,在jsx中实现vue里的scoped

引言

总的来说,我们的组件需要一个全局唯一的样式名,避免污染全局样式。
vue中有scoped可以给组件添加一个data-v-id的attribute,那在jsx中如何处理?

方式一

我们自己把组件中的样式命名的全局唯一。

方式二

使用postcss-modules:

postcss-modules是一个PostCSS插件,实现了css的模块化的概念,可以单独引用,每一个引用都是一个副本或着说是一个实例,自己带着唯一标识。
例如,你有以下CSS:

/* styles.css */
:global .page {padding: 20px;
}.title {composes

康明心理咨询