React Typescript SassError Undefined variable.
I need some help on this please 🙏 I am new to using
sass
with react && typescript
, so I declared a variable in a scss
file but all I'm getting is an error that says Undefined variable
24 Replies
Whats the index.sass look like? Also you are importing index.sass not scss not sure why the switch. Make sure you use the same type as
.sass
has different syntax.
would help to share the vars.scss tooThe reason why i did that was to follow the The 7-1 Pattern
I'm not questioning the folder struct but more why you are using .sass on index not .scss they are different syntaxes
oh! i will change that now
Would help if you show their code too though .
This is what i have in the file
And the variable definition?
I'm still learning to use
@use
@forward
better myself. Give ma few I'll look at it harderok
in your login.scss try
@use ".../abstracts/variables" as *;
when you use @use
typically its going to take the name of the file and use it like variables.bg
might be better to forward it 🤔Wait why do you use
use
? I follow the 7-1 architecture pattern as well and I don't use use
and my variables work just fineThis might help you (if you havent checked it out already): https://github.com/KittyGiraudel/sass-boilerplate
GitHub
GitHub - KittyGiraudel/sass-boilerplate: A boilerplate for Sass pro...
A boilerplate for Sass projects using the 7-1 architecture pattern from Sass Guidelines. - GitHub - KittyGiraudel/sass-boilerplate: A boilerplate for Sass projects using the 7-1 architecture patter...
Can we see your index.scss file?
Oh, I see. I use
@import
instead of use
If you check out the boilerplate you'll seeAlso, I'm writing a react app with scss right now so if you want to check it out and see how I did mine: https://github.com/vince1444/Listen-Party
GitHub
GitHub - vince1444/Listen-Party
Contribute to vince1444/Listen-Party development by creating an account on GitHub.
Import is deprecated
You should be using forward and use.
Oh wow really? Okay, interesting the github for that isn't updated. She's pretty active too
Sass: Syntactically Awesome Style Sheets
Syntactically Awesome Style Sheets
dart sass is
sass
vs node-sass
(which you shouldn't be using cause its deprecated too)Interesting, it seems I don't use either... anyway back on topic 😂
This should be the fix just have not heard back
Okay cool, I'll keep this thread handy since I'll move over to use as well
Thanks
@import
is deprecated
This solved my problem for me
Great ..i will check it out ... thanks
Yes i don't want to use node-sass