SASS is not compiling to CSS

Question

So I'm a newbie trying to learn SASS/SCSS/Bootstrap. I'm working on VSCode and installed SASS and bootstrap via npm in the terminal. All was well and I was working on this particular project for a few days until SASS stopped compiling out of the blue. I noticed that if I make changes to my main style.css sheet it will be reflected in the browser, however any changes to the scss partials and it's not compiling to the main style.css sheet.

To complicate things further, I was on the package.json file and clicked on 'Debug' where it made it worse - now there's no styling at all. The style.css sheet somehow consists of

@use "custom";
@use components/buttons;
etc etc..

and

@use sections/navbar
@sections/intro-section
etc etc...

The Live Sass Compiler is working and is 'watching'. I have Live Sass Compiler and Live Server installed as extensions. I'd appreciate any help as I was stuck on this the whole day!

I'm new here so I wasn't allowed to upload images directly.

screenshot 1

screenshot 2

screenshot 3

Answer 1

Are you compiling on your local machine with VSCode using LiveSassCompiler by Glenn Marks ( glenn2223.live-sass )? If you are using ritwickdey.live-sass , try swapping it for Glenn's as the latter is no longer maintained I think. Then, try appending a .bak to the style.css and style.css.map to regenerate the CSS with the compiler.