Attaching a SCSS to HTML docs [closed]

Question

Hello I am new to web design. I would like to learn how to attach an SCSS file to an HTML file in the head tag :

<link href="example" rel="stylesheet/scss" type="text/css">

I tried this but did not see the result. I guess that it's like the LESS framework. And another question: If I want to use SCSS I should compile it to hosting or not?

Kirchhoff

Hey! Just use jsonformatter.org/scss-to-css and paste the SCSS code then it will transfer that code into CSS! All you need to do is copy the CSS output – Rathe

You should Link style.css like normal because When you compile the SCSS file it will generate a CSS file and use that to apply the style you added. – Galleass

Answer 1

You can not "attach" a SASS/SCSS file to an HTML document.

SASS/SCSS is a CSS preprocessor that runs on the server and compiles to CSS code that your browser understands.

There are client-side alternatives to SASS that can be compiled in the browser using javascript such as LESS CSS, though I advise you compile to CSS for production use.

It's as simple as adding 2 lines of code to your HTML file.

<link rel="stylesheet/less" type="text/css" href="styles.less" />
<script src="less.js" type="text/javascript"></script>

Ambroseambrosi

Refused to execute script from 'localhost:8100/less.js' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled. – Vitreous

text/html?!! where dis that come from? By the way, it is not a good idea to use .less in production, compile to .css and include it. Otherwise, the above is fine for development. – Unhealthy

Updated Version On Website: <link rel="stylesheet/less" type="text/css" href="styles.less" /> <script src="https://cdn.jsdelivr.net/npm/[email protected]" ></script> – Extraditable

Just use jsonformatter.org/scss-to-css and paste the SCSS code then it will transfer that code into CSS. – Finland