How to use scss in wordpress theme?

by

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

3 Answers
3

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.

Leave a Comment