在脚本标记后的vue文件中，我正在导入如下样式：
<style scoped lang="scss" src="../../styles/scss/components/_navbar.scss"></style>
这与webpack和babel结合使用时效果很好，但我也想在scss中使用“全局”变量，所以我有要导入其他文件的main.scss文件：
@import 'abstracts/mixins';
@import 'abstracts/variables';
@import 'base/base';
@import 'base/typography';
实际上，我只是在App.vue（Vue SFC的根目录）中导入此文件，但是显然没有scoped指令：
在_navbar.scss中，我希望可以访问main.scss -> @import 'abstracts/variables';的变量
但是显然我没有，因为它会显示错误，指出变量未定义
未定义变量：“ $ color-grey-light”。
因此，我目前仅在_navbar.scss中再次导入变量。如何避免这种情况，但通过导入独立的.scss文件来保持这种良好的结构（至少对我而言）？