What is the easiest way to use scss?
i Tried the wp-scss plugin but it doesnt seems to work for me:
In my theme: root: css -> style.css scss -> style.scss
settings for scss and css location are '/scss/' and '/css/'.
style.scss $pink : #7e40e4;
style.css .bg {background:$pink}
doesn't work, what am i missing?
Thanks
WordPress core by itself doesn't support SCSS, even though it is actually used in core development now.
The issue with "plugin" type solutions to add such support transparently is that they rely on "ports" of preprocessors. SCSS is not natively developed for PHP, running it in such environment is only possible with third party re–implementations. While ports mostly work, from my experience they are plagued with issues and routinely lag behind in version updates.
The more practical approach is too compile your SCSS during development (using native engine and maybe tools that extend it for convenience) and use build results as regular CSS.
I suggest you start with the WP Bones theme startup theme. It's actually how i got into scss for the first time. It explains all you need to understand about scss and sets you up directly in a good file system and scss configuration for Wordpress.
Also, you may feel more comfortable using a software like Codekit to handle the configuration and compilation tasks of your scss files. There are free alternatives (but i find Codekit to be worth the small investment).
If you're looking a PHP code based approach there is a SASS (SCSS) PHP package for compiling SASS available at https://scssphp.github.io/scssphp/. It provides a CLI command also, but it's main approach is to be used to compile on the fly. I opted for this approach in a custom theme project where I wanted to use SCSS. Of course I don't want to compile SCSS on every page load, so what I did was setup a custom page template page-compile.php in the theme, and in that I run the compiler. The output is then enqueued just like any normal CSS file. Whenever we want to recompile, just land on /compile and it runs and updates all the CSS. In production maybe we will start using CLI build instead.
Another approach I thought about but never researched was to find a compiler tool and use it. There are probably dozens of options. As far as relevance to the original question, like a lot of questions about WordPress theme development it's just important to remember that while WP itself doesn't provide a direct support for this you can use any tools you want to create the output CSS and as long as you do that, your able to write SASS code and end up with it enqueued as regular CSS in your WP theme.
Because I like working with PHP (my old friend PHP) I just prefer rather than a build process to have a compiler with PHP process because it feels more familiar to me and the setup is just a few lines, and if anything goes wrong at a PHP level I know how to debug it easily. Build processes always leave me feeling uncertain if they break, I don't know really know how they work under the hood.
