Jekyll won't compile scss variables

Hi, my Jekyll install isn’t processing any of my SCSS variables.

I have the following structure:

_scss/
|--base/
|  |--_variables.scss
|--components/
|  |--_buttons.scss
|--layout/
|  |--_grid.scss
|--main.scss
assets
|--css/
|  |--styles.scss

Contents of _sass/main.scss:

@import "base/variables"
@import "components/buttons"
@import "layout/grid"

Contents of assets/css/styles.scss:

---
---
@import "main"

My config settings:

sass:
    sass_dir: _sass

The compilation looks like it happens and builds without error, but the resulting styles.css has the SCSS variables in it so it seems like they weren’t compiled.

Any idea what might be going on? Thanks for any tips.

Can you share the exact output of styles.css please?

are you using liquid in the variables? IIRC you can’t do that unless the file has front matter and you can’t have front matter in the _scss folder?

Not that I’m aware of, the variables are standard SCSS variables such as $margin-width: 20px; and similar. The only thing I can think of is that some use calc() but it works elsewhere.

do you get any errors?

I also had issues with comments in the scss I think.

I’m really trying to help, but I need the resulting styles.css contents for that