How to Import a Sass File into Every Vue Component in an App
If you're working on a large-scale Vue application, chances are at some point you're going to want to organize the structure of your application so that you have some globally defined variables for CSS that you can make use of in any part of your application.
This can be accomplished by writing this piece of code into every component in your application:
<style lang="scss">
@import "./styles/_variables.scss";
</style>
But who has time for that?! We're programmers, let's do this programmatically.
Why?
You might be wondering why we would want to do something like this, especially if you're just starting out in web development. Globals are bad, right? Why would we need this? What even are Sass variables? If you already know all of this, then you can skip down ...