Module Values

Compatibility:

Dart Sass

since 1.105.0

LibSass

✗

Ruby Sass

✗

Modules can also be values! You can’t directly write a module as a value, but you can refer to a @used module via meta.get-module() or load a new one via meta.load(). Module values make it possible to choose whether or not to loda a module based on your stylesheet’s logic, or to conditionally load different modules.

Once you have a module value, you can use various additional functions to inspect and interact with it:

• meta.module-variables() and meta.global-variable-exists() allow you to inspect its variables.
• meta.get-function(), meta.module-functions(), and meta.function-exists() allow you to inspect its functions.
• meta.get-mixin(), meta.module-mixins(), and meta.mixin-exists() allow you to inspect its mixins.

In addition, you can use the [meta.css()] mixin to include the CSS that a module value contains.

// _themes.scss
@use 'sass:map';
@use 'sass:meta';

@function load-theme($theme-name) {
  $module: meta.load('themes/#{$theme-name}');

  @each $token in ['foreground', 'background', 'highlight'] {
    @if not meta.variable-exists($token, $module: $module) {
      @error "#{$theme} is missing $#{$token}";
    }
  }

  @return meta.module-variables($module);
}

// themes/_desert.scss
$foreground: #783314;
$background: #ec883c;
$highlight: #a9c6e6;

// _themes.scss
@use 'sass:map'
@use 'sass:meta'

@function load-theme($theme-name)
  $module: meta.load('themes/#{$theme-name}')

  @each $token in ['foreground', 'background', 'highlight']
    @if not meta.variable-exists($token, $module: $module)
      @error "#{$theme} is missing $#{$token}"



  @return meta.module-variables($module)

// themes/_desert.scss
$foreground: #783314
$background: #ec883c
$highlight: #a9c6e6