someone has probably asked this before, but I’m unable to find the solution I think I’m looking for.
I’d like to be able to code in SASS within my HTML file and have that be compiled through VS CODE’s live server or my localhost server, but have been unable to achieve this.
The solution I’ve found so far is to use the Live Sass compiler extension, which basically just rewrites your code into CSS for it to then be linked to your HTML file and run through your browser.
This is fine when the files are separate, but if I’m coding Sass within the HTML file I can no longer take this approach.
How does the FCC coding environment manage this?
Anyone have any recommendations/tips?
Thanks in advance!
You can’t write SASS in HTML, browsers cannot understand SASS, they only know CSS. That’s why you need a precompiler to turn your SASS into regular CSS before it’s delivered to the browser.
The way the code is transpiled on the fCC platform is slightly convoluted. Majority of the logic is here: freeCodeCamp/transformers.js at main · freeCodeCamp/freeCodeCamp · GitHub
The main takeaway is:
- Camper code is just text
- If a Camper is on a challenge with SCSS, the necessary library is fetched to transpile it
- The Camper code is nothing but text. So, it is ripped from the editor, and passed to the
sassWorker which does its transpiling magic
- What the
sassWorker spits out is passed to the
style element before being rendered in the
iframe housing the preview
Hope this helps
Why do you want to code the CSS in the HTML anyway?
You’re right, there’s no exact need, I always just try and make sure I know how to work these languages outside of the FCC environment to improve my practical skills
This was my first time working with SASS, and I wasn’t sure if it was a compiled language like PHP that can he run through the localhost server using XAMPP
VSCode let me install the package through npm, but it didn’t seem like it did anything (I’d already had extension packs to code Sass within VSCode itself) .
I had a feeling it was like this, nut nice to know for sure
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.