css 文件中的 Javascript 颜色代码变量 (React JS)

Question

我在 JS 文件中有颜色代码列表。

JavaScript：

export var ColorCodes = { 
    first:'#D09FD2',  
    second:'#A72500',  
    third:'#F67GHI',   
    fourth:'#8FERDD',  
} 

我尝试在 CSS 文件中使用 js 变量，如下所示。

它会引发错误。

CSS：

import 'my.js'

.firstColor{

    font-size:15px;
    color:ColorCodes.first;
    }

.secColor{

    font-size:12px;
    color:ColorCodes.second;
    }

HTML

<div class="firstColor">aaa</div>   

Answer 1

您不能在 css 中使用 js，而是应该在 css 中抽象您的颜色代码，然后通过 javascript 使用动态类