I was finding a solution from yesterday to link a file to an HTML file.
Finally, I found the solution to the problem.
I share the solution with you all and hope it will be informative to one of you.
If there is a separate .scss file as style.scss How to link .scss file in .html file?
Problem:
Initially, I tried to link in the .html file as mentioned below,
The above method did not work. Later I understood that It is impossible to link a .scss or saas file inside the HTML file.
Solution:
I use VS Code as IDEA for coding purposes.
VS Code has an extension named Live SAAS Compiler.
Install the extension and then link the .scss link as mentioned below,
(make sure to change the style.scss into style.css inside the link tag but not in the original file).
Then click on the Watch Sass button in the footer of the VS Code IDEA.
At last, you can view the design using the browser.
Thank you so much for reading the post. I hope you got to learn a new tip.
Top comments (2)
Hello, typically we don't "link" scss files directly to html documents. We live in an age where you write code in scss then transform it into CSS to be "linked". To do this, install sass CLI and follow the instructions to compile (compile means to transform) scss files, you can even do this as you change your scss files using watch mode.
To see this in action, try a live web version sassmeister.com/
A vscode plugin helps but it's not scalablenor how it is meant to be.
Thank you so much.