Всем привет, подскажите, пожалуйста, как можно менять динамически переменные scss?

Question

Всем привет, подскажите, пожалуйста, как можно менять динамически переменные scss?

Я попробовала, как в одном примере нашла передать
:style="cssProps" после <template > в div свойство
computed: {
cssProps() {
return {
'$main-color' : this.mainColor,
};
},
},

И в стилях
<style lang='"scss" >
.card {
background: $main-color;
}
</style>

Но у меня не работает - SassError: неопределённая переменная