How to override sass variable in vue component?

Question

Sass

There is a global _variables.scsswhere the variable is defined. $var: 0;

How can I redefine the value of this variable in the view component?

Tried so, in the forehead, but does not take off

<style scoped lang="scss">
    $var: 10;
</style>

There are elements in the component whose styles depend on this variable, and I need to change the variable itself, and not rewrite the styles. It seems that this is the meaning of variables, but I’m not in sass at all

Answer 1

sass variables disappear when sass is converted to css, so it won't come out.
But you can use css variables

Answer 2

you can't do that with scss variables. but with regular css variables you can. google about them

Answer 3

If you do not need the value of this variable, then why are you declaring it again at all? Apparently, it doesn’t matter to you what it will be called, it will have a completely different meaning, so does it make sense? Maybe it's easier to create a variable with a different name? $locVar: 10 ?