How do I access Sass variables inside a Vue component?
There's a discussion on the official vue-loader repo with the exact same question and it boils down to: no, you have to import the variables file in each .vue component that needs it.
One thing you can do to simplify the situation slightly is to add the folder with the variables file to your include paths, so you can just do @import "my-variables.scss"; instead of specifying the entire path every time.
you can archive this by importing this in you top level component, usually called <app></app> and expose it by using a css class:
.primaryColor { color: <variable here>}Then you can just access that class in every child component
Not always applicable but if you're using Vue as part of a Nuxt application then you can use style-resources-module to achieve this.