How to control font size based on @media when new sass @use modular system is used

[creaux]

There is a new modular system of SASS which will soon cause the removal of @import. So at this point make sense to ask questions about how to figure out specific use-cases using @use.

This is how to write something globally. So means we cannot put this into the @media at-rule.

@use '~bootstrap/scss/bootstrap' with (
   $font-size-base: 12px,
)

There is some kind of solution at the moment using @use 'sass:meta' library:

@media print {
   @include meta.load-css('~bootstrap/scss/bootstrap', $with: (font-size-base: 10px))
}

The problem of the load-css solution is not clear in comparison with @use. It leads to the following issue: SassError: This module was already loaded, so it can't be configured using "with". everywhere where bootstrap import using @use is made.

The first of all question is whether even load-css solution is the right way or there should be something more flexible as this not suppose to override variables further in comparison to @forward ... with ( ... ).