SCSS variables are not working

sage
,
1

I am trying to get my SCSS system working in Sage 10. While the files are correctly being compiled with yarn build, the variables are not working.

In the compiled app.css file within the ‘public’ folder, the variables are not being parsed, and are instead printing as $[variable] (e.g., border-bottom:1px solid $dark-blue).

There is mention of this issue within the following thread, but it was closed before a resolution could be reached:

I am receiving no compilation error regarding this.

Note: I have both @roots/bud-sass and @roots/bud-postcss installed as dev-dependancies.

2

Howdy! I’m unable to reproduce.

Are you able to share a repo where this is broken for you?

4

Yes; please see the following:

I managed to get the SCSS to compile through trial-and-error, so I am not fully certain whether the files within /styles are set-up correctly.

I am using Windows with WSL to compile, fyi.

5

Thanks, I’ll try to take a look later. I’d try out removing app.css entirely first though, since you should just be using app.scss

6

thanks for pointing that out; it was the cause of the issue.

1 Like