visual studio code keeps creating my css file to be in the same folder as my scss file

Question

Whenever I try placing my css file in a different folder to my sass file, the minute I select the scss watch complier, a new css file gets re-created in the same folder where my scss is placed.

I am trying to keep them separate, is this even an option?

The screenshot shows the different css folders I created trying to keep them seperate, but the watch compiler seems to over-ride this:

Answer 1

You need to configure Live Sass Compiler to change the savePath for the compiled files.

"liveSassCompile.settings.formats": [
   {
      "savePath": [Any path you want]
   }
]

Here is the full documentation of the extension and how you can edit VSCode settings.