css - 从 JSON 文件或打字稿文件定义 CSS 变量的方法？

Question

我想像在 Sass 中一样定义 CSS 变量。就像是：

.someClass {
  background-image: $imageLink;
  color: $someColor;
}

我想在我的班级或 json 文件中定义 $imageLink 和 $someColor 。

我可以在没有 Sass 或 Less 的情况下做到这一点吗？（或者没有 css 变量，因为它在 IE 中不支持。）

我在我的项目中使用了 angular2 和 webpack。

Answer 1

当然你不能在运行时设置 SASS 变量，因为到那时 SASS 已经被编译了。

一个经典的方法是转而考虑“主题”，并通过更高级别元素（例如主体）上的类来选择主题。所以你可以有

.darktheme  .someClass { color: white; }
.lighttheme .someClass { color: black; }

现在从你的 JS 你可以改变主题

document.body.classList.add('darktheme');