如何在CSS模块中使用全局变量？

  • Z时代
  • 2024-01-10
  • 分类：问答

我正在忙于学习React with CSS-Modules，但我不太了解如何存储变量？例如，在Sass中，您可以执行以下操作：

// _variables.scss
$primary-color: #f1f1f1;
// heading.scss
@import './variables';
.heading {
  color: $primary-color
}

您如何在CSS模块中实现这一目标？

回答：

一种方法是使用依赖关系。例如，

// variables.css
.primaryColor {
  color: #f1f1f1
}
// heading.css
.heading {
  composes: primaryColor from "./variables.css"
}

在此处查看更多详细信息：https :

//github.com/css-modules/css-modules#dependencies

如果您使用的是webpack，则此处还有更多示例：https : //github.com/webpack/css-loader#composed-css-

classes

同样，如果您使用的是webpack，您仍然可以将Sass与CSS模块一起使用。

以上是 如何在CSS模块中使用全局变量？ 的全部内容， 来源链接： utcz.com/qa/427945.html

回到顶部