title: Global scss variables for Angular components without importing them everytime
body: <p>I do already have SCSS variables defined in <code>src/styles/settings/_variables.scss</code> and I am importing them into <code>src/styles.scss</code>, but still these variables aren't available for every single component.</p>
  
  <p>Is there any way to make a global file which holds all SCSS variables for the rest of my components? Because writing <code>@import</code> in every single component <code>.scss</code> file it is very frustrating, especially if I have many nested components.</p>
  
  <p>I know, there is a lot of similar questions, but it seems like they're all outdated and do not relate to the recent versions of Angular.</p>
  
  <p>I use Angular 7.3 with CLI.</p>