Vue中scss如何与js共享变量

本文前提是使用了scss，并且在vuex和scss中都使用主题色变量。

一、定义公共变量

创建一个scss文件如： config.module.scss

// 定义主题色变量
$themeColor: rgba(53,123,255,1);
:export {
    themeColor: $themeColor
}

二、JS中使用

// 此处我在vuex中使用
import config from "@/static/config.module.scss";

export default {
    state: {
        themeColor: config.themeColor
    }
}

三、在组件中的scss调用

@import "../static/config.module.scss";  // 引入

div{
    color: $themeColor;  // 使用
}