在React中将变量导入css模块

问题描述 投票:0回答:1

我使用CSS模块和我的css / stylesheet文件住在我的组件旁边。

支持可导入样式表的全局颜色文件的最快方法是什么?

我的css-modules和webpack默认支持这个吗?救命。

css css-modules react-css-modules
1个回答
1
投票

你在用CRA吗?如果是这样,你可以。您只需要确保使用postcss和postcss-modules-values插件。注意:如果没有Create React App(尚未),请不要对此进行测试,因此,如果有人有,那将有助于了解。

现在,您只需要创建一个样式表(或者只是使用index.css,您的选择),并执行以下操作:

@value blue: #0c77f8;
@value red: #ff0000;
@value green: #aaf200;

现在,从组件范围的css文件,只需导入和使用(几乎类似于JS):

/* import your colors... */
@value colors: "./colors.css";
@value blue, red, green from colors;

.button {
  color: blue;
  display: inline-block;
}

Source(文档)。

© www.soinside.com 2019 - 2024. All rights reserved.