Im trying to learn sass and JavaScript using VS Code. I created an app folder that holds my js folder which contains my script.js and scss folder that contains my _globals.scss. _header.scss, _variables.scss, and style.scss. I created a dist folder that contains my style.css and style.css.map. I have my html linked to my dist/style.css but I cannot get any of my pages to connect to my html page. I have the @import variables, globals, and header set in my style.scss page but the only styles I can add to my webpage is from the html document itself.

I’ve tried very little because I’m new to web development. Working from a MacBook, I downloaded homebrew, git, and a couple other apps I saw on YouTube. I tried changing my @imports to @use and adding them directly to the style.css but that did not help. I was expecting by downloading any of those files would get my pages to communicate with each other.

CodePudding user response：

Are you trying to import the .scss files on your styles.css? If so, this is not the right way to work with sass.

To be able to "transform" the .scss files into .css, you have to compile these files using the CLI (command-line/terminal).

This video shows how to do this procedure.

It the above is not the case, could you please send us screenshots of what you're trying to do, it will be really helpful to help you to fix this issue.

CodePudding user response：

First of all, make a new file in CSS(type), then link that file using link tag in your Html WebPage and give the CSS file address in link tag.