Skip to content
Advertisement

How do I pass variables to scss processor?

My current set up is Front-end: VueJS

Backend Python, Tornado

Vue is used using the cdn for indivudual static templates. Tornado serves the templates. I’m using the python scss library to compile the scss, that part of pretty straight forward.

sass.compile(dirname=(os.path.join(os.path.dirname(os.path.abspath(__file__)), 'static/scss'), os.path.join(os.path.dirname(os.path.abspath(__file__)), 'static/css')), output_style='compressed')

I have two config.py files that hold configurations with two different color schemes among other things, I would like to use pass the color vars in those files to the scss file but don’t know if there’s a way/possible.

I can pass global variables to the templates using tornado but that’s not what I need because the scss file has to get compiled using those colors before that happens. I’ve done tons of research before this but can’t find exactly what I need so maybe someone has done this before.

Advertisement

Answer

Ah-ha! You can pass custom functions to the compiler to communicate with the file.

https://sass.github.io/libsass-python/sass.html#custom-functions

User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement