# Jekyll won't compile scss variables

**URL:** <https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217>\
**Category:** Help\
**Created:** [May 4, 2023, 9:48am UTC](https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217 "2023-05-04T09:48:33Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![electrolyte](https://avatars.discourse-cdn.com/v4/letter/e/f475e1/32.png) [@electrolyte](https://talk.jekyllrb.com/u/electrolyte)\
**Post date:** [May 4, 2023, 9:48am UTC](https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217/1 "2023-05-04T09:48:33Z")

</div>

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

I have the following structure:

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

```

Contents of `_sass/main.scss`:

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

```

Contents of `assets/css/styles.scss`:

```auto
---
---
@import "main"

```

My config settings:

```auto
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.

---

<div class="post-metadata">

**Author:** ![pcouy](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/pcouy/32/5307_2.png) [@pcouy](https://talk.jekyllrb.com/u/pcouy)\
**Post date:** [May 4, 2023, 10:27am UTC](https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217/2 "2023-05-04T10:27:37Z")

</div>

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

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [May 4, 2023, 4:22pm UTC](https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217/3 "2023-05-04T16:22:48Z")

</div>

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?

---

<div class="post-metadata">

**Author:** ![electrolyte](https://avatars.discourse-cdn.com/v4/letter/e/f475e1/32.png) [@electrolyte](https://talk.jekyllrb.com/u/electrolyte)\
**Post date:** [May 4, 2023, 5:20pm UTC](https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217/4 "2023-05-04T17:20:38Z")

</div>

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.

---

<div class="post-metadata">

**Author:** ![rdyar](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/rdyar/32/710_2.png) [@rdyar](https://talk.jekyllrb.com/u/rdyar)\
**Post date:** [May 4, 2023, 6:49pm UTC](https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217/5 "2023-05-04T18:49:34Z")

</div>

do you get any errors?

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

---

<div class="post-metadata">

**Author:** ![pcouy](https://yyz2.discourse-cdn.com/flex030/user_avatar/talk.jekyllrb.com/pcouy/32/5307_2.png) [@pcouy](https://talk.jekyllrb.com/u/pcouy)\
**Post date:** [May 4, 2023, 10:04pm UTC](https://talk.jekyllrb.com/t/jekyll-wont-compile-scss-variables/8217/6 "2023-05-04T22:04:02Z")

</div>

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