can you add more than one additional data with the route to another scss file, so you can have multiple sharable scss files across the different components?
Thanks for this. I have encountered an error while following this tutorial. For some reason it doesn't work. I think i have the latest vue cli so I used this instead: npm install -D sass-loader@^10 sass Which was actually on the guide with vue sass loader. Just in case some also encountered an issue. Cheers!
Ok the issue is with Node version , if you use Node 14.x.x and you use --> "vue init webpack app-test..." Then you need to install node-sass@4.14.1 and if you use Node 15.x.x then it won't work..
For reference, @import would pull in the entire file every time you imported it from multiple files and every variable, mixin, etc was global. @use - only imports the file once, no matter how many times it’s imported from different files. It also makes variables, mixing, etc. scoped to the file with a namespace so that you can find errors much easier. @forward - does the same thing as @use except it makes all variables, mixing, etc. local to the file you are bringing it in on. This way you don’t have to use namespaces. This is great for index files.
@@mattc16 how do add namespaces in vue.cofing.js? AdditionalData has backquotes so, in '@use "@/styles/sass/variables.scss" as variables' (for example) 'as variables' isn't interpreted.
Do it like that and you will have to remember you did it like that. Do it for 6 different files and you are lost after a day or two. After 3 days you will be scratching your head why stuff that is supposed to be working is this way is working that way. In summary, build trees not graphs (yeah, I know a tree is a graph), hopefully you know what I mean ;)
well is it tho, u go to their website and see sass and scss and css next to eachother, ok scss is with css rules, brackets, semicolons, ok whatever ill add those and finito
This one weird trick made woman want me. How many ,,these one weird tricks" are there? I love how youtube geeks incorporate these one weird tricks from adult sites to their cheap clickbaits :D
📚 Check out this black friday - Cyber Monday sale!!
course.vuecourse.tech
Heard this trick in a podcast... glad to see it in video ! This tricks are very useful !
whats the name of the theme you are using in vscode?
Synthwave 84
What VS code theme do you use?
I think is SynthWave ‘84
You had helped me a lot bro! Thanks!!
can you add more than one additional data with the route to another scss file, so you can have multiple sharable scss files across the different components?
Thanks Erik you saved my time
Noice !!!! Really luv ur vids !! Great vids
I was looking exactly that, thx a lot
Thank you man.
How to configure for the nuxt? Thank you 😊
Thanks for this. I have encountered an error while following this tutorial. For some reason it doesn't work. I think i have the latest vue cli so I used this instead:
npm install -D sass-loader@^10 sass
Which was actually on the guide with vue sass loader.
Just in case some also encountered an issue. Cheers!
thanks for the suggestion, i was getting that error
vary helpful
In order to make the Css file in the public folder as a compressed file, what should I add? thank you
Thanks
useful skills!! keep it up!
thanks, you're the best 👍
What is extension lit up font ?
I am currently creating a shopping basket with Vue 3 and SASS, thanks for the hint :-)
Does this still work if you are using nuxt? I get errors thrown in my components that my sass variables defined in my global are undefined :-/
When I add a new import file, the server does not start without turning it off and on, what do you think?
Can we use this trick in Angular as well?
Any reason why you named your global css that starts wtih _ ?
I've seen 20 incorrect tutorials before yours, thank you sir!
What should i do if i want to use an indentation of 1 tab instead of 2 spaces?
Isn't it bad practice to use @import? Scss requires us to use @use now
isnt better to use scss style file rather SFC styling? And why?
Ok the issue is with Node version , if you use Node 14.x.x and you use --> "vue init webpack app-test..." Then you need to install node-sass@4.14.1 and if you use Node 15.x.x then it won't work..
Thanks!
not working vue3 application using cli
teşekkürler
Very helpful and looks really simple, thanks!
nice..
And now you get thumbs up! :P
Yay, thank you!
1. Don't use @import any more, use @use and/or @forward.
2. In vite 2.0 the setup is the same, except it's in vite.config.[ js/ts ]
& scss will compiled (to css) on the vite server running? is a PostCSS needed
For reference, @import would pull in the entire file every time you imported it from multiple files and every variable, mixin, etc was global.
@use - only imports the file once, no matter how many times it’s imported from different files. It also makes variables, mixing, etc. scoped to the file with a namespace so that you can find errors much easier.
@forward - does the same thing as @use except it makes all variables, mixing, etc. local to the file you are bringing it in on. This way you don’t have to use namespaces. This is great for index files.
@@mattc16 how do add namespaces in vue.cofing.js? AdditionalData has backquotes so, in '@use "@/styles/sass/variables.scss" as variables' (for example) 'as variables' isn't interpreted.
Do it like that and you will have to remember you did it like that. Do it for 6 different files and you are lost after a day or two. After 3 days you will be scratching your head why stuff that is supposed to be working is this way is working that way. In summary, build trees not graphs (yeah, I know a tree is a graph), hopefully you know what I mean ;)
Epic
Not working, I don't know how I have issue installing SASS always. Now I need to first solve issue of installing SASS and then too watch this video..
Yes! Check out some of my other vids on Vue and Sass
Trying to figure out if this title is making fun of clickbait or surrendering to it
"For Sass, use SCSS" - This must be so confusing, unless you know why that is.
well is it tho, u go to their website and see sass and scss and css next to eachother, ok scss is with css rules, brackets, semicolons, ok whatever ill add those and finito
I also do videos about programming!😁
Nice content man...... I also do the same thing
@@abhinavgeorge5714 Thanks man😄
oh dude. too less likes then you deserve) ty sooooo much
This one weird trick made woman want me. How many ,,these one weird tricks" are there? I love how youtube geeks incorporate these one weird tricks from adult sites to their cheap clickbaits :D
Super cooool but better to use tailwindcss 😂😁😁😁🔥🔥🔥🔥
Tired of your tricks