将.env变量导入Vuetify variables.scss

问题描述

• 在Vue-cli Webpack项目中，我在.env文件中定义了一个环境变量，如下所示：VUE_APP_FONT_SIZE=30px
• 然后在vue.config.js中，我像这样“添加”它：

let sav = ''
    
if (/VUE_APP_/i.test('VUE_APP_FONT_SIZE')) {
    sav += `$${'VUE_APP_FONT_SIZE'}: "${process.env['VUE_APP_FONT_SIZE']}";`
}
    
module.exports = {
    css: {
        loaderOptions: {
            scss: {
                prependData: sav
            }
        }
    }
}

• 然后，我可以在任何.scss文件中使用它，例如：font-size: unquote($VUE_APP_FONT_SIZE);
• 但是，如果我尝试像这样在Vuetify variables.scss文件中使用它：$font-size-root: $VUE_APP_FONT_SIZE;我会得到指向$VUE_APP_FONT_SIZE的未定义变量错误。

如何在Vuetify variables.scss文件中使用.env变量？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）