js引入scss导出的变量为空

最近在学习vue3时用到了scss的:export,script中import variables from '@/styles/variables.scss'后输出variables始终为空，反复百度排查，最终在这篇文章中找到了解决办法，花费了不少时间，记录一下，希望有大佬可以解答一下:export为空的原因