How to control Sass Variable with javascript

Question

I have a Sass file which is generating a CSS file. I have used many variables in my sass file for background color, font-size, now I want to control my all variables through JavaScript.

For example, in style.sass we have

$bg : #000;
$font-size: 12px;

How can I change these values from JavaScript?

Answer 1

JavaScript runs client-side (in the web browser), while Sass is generated server-side, so you have to find some way to bridge the gap that gap. One way to do this would be to set up some AJAX-style listening to send JavaScript events over to your server, and then have the server edit and re-compile your style.sass file.