I have taken a look at your code, I can see that you probably use the vscode extension SASS/SCSS compiler. What I would call the best or at least one of the best ways would be to use a bundler. There is many bundlers like Parcel.js, Webpack and vite (I personally used all of them and I'll say that vite is the best since it's the fastest of all of them).
Using a bundler will be great in the long run since I guess you will later try to learn JS etc., it will help you especially when you are creating components, exporting/importing stuff etc.
If you want to use vite jump on this site:
Vite
or just paste this into terminal:
npm create vite@latest
After that all you have to do is enter prompts paste this into terminal
npm run dev
and have fun!
(Oh forgotten to add more information to this, when using a bundler you don't have to worry about importing/linking already compiled SASS code. Just link your stylesheet like always but instead of linking it with .css use .scss directly in html (In case you don't import styles in js code))
Marked as helpful
@rileydevdzn
Posted
Hi Bartosz!
Yes, I started with the VS code extension for SASS/SCSS compiler. I've seen a lot of references to bundlers (mostly Webpack, but I've been seeing more mentions of Vite lately) and I think a bundler will be my next step. :)
I'll start with Vite, per your suggestion. Thank you for the references and explanation, this was very helpful!