Access to sass variables in component style files

Help Requests
1

Say my my-app.scss looks like this:

@import '.../.../.../bootstrap';

$my-var: 120px;

.my-class { 
...
}
...

Now if I create a component and create it’s own scss file: my-component.scss, how do I access variables and classes from my-app.scss?

@extend .my-class;  // throws an error -> cannot find my-class

margin-top: $my-var;  // throws an error -> cannot find $my-var