How to compile .scss files ito .css file?

Newbie here. I have a stylesheet, main.css, that is linked to in my website, that looks like this:

@import "modules/reset.scss";
@import "modules/base.scss";
@import "modules/header.scss";
@import "modules/footer.scss";
@import "modules/blocks.scss";

I’ve been messing around with the header.scss and the changes I’m making are showing up. But the variables that are listed in base.scss aren’t showing up – these are mostly my colors and such. I’ve never worked with .scss files, but it seems from my research that you have to compile them into .css files? How do you do that?

I do have

wp_enqueue_style( 'mwp-css', get_stylesheet_directory_uri() . '/css/maincompiled.css', array('mwp-fonts'), null);

in my functions.php file