Home/ Questions/Q 8933033
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-15T09:26:30+00:00

I’m using .scss files in my Rails application and previous I was using: @import

  • 0

I’m using .scss files in my Rails application and previous I was using:

@import "bootswatch/superhero/variables";
@import "bootswatch/superhero/bootswatch";

But I would like to do something like:

$theme: 'superhero';
@import "bootswatch/#{$theme}/variables";
@import "bootswatch/#{$theme}/bootswatch";

Unfortunately this doesn’t work, the variable isn’t being embedded. How can I go about doing this to avoid having to change my application.css.scss too many times when I want to change themes?

Other Attempts Without Success

@import "bootswatch/" + $theme + "/variables";

$theme_variables: "/bootswatch/#{$theme}/variables";
@import $theme_variables;
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Looks like you can’t:

    Imports may contain #{} interpolation, but only with certain restrictions. It’s not possible to dynamically import a Sass file based on a variable; interpolation is only for CSS imports. As such, it only works with url() imports.”

    see http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#import

    This is probably because it tries to minimize recompilation between imports by calculating dependencies – which I imagine becomes very hard with dynamic imports.

    I’d suggest having a main file per theme and importing that.

    • 0