Add docs for reassigning module vars. (#546)

Co-authored-by: Natalie Weizenbaum <nweiz@google.com>
This commit is contained in:
Awjin Ahn 2021-12-15 18:09:18 -08:00 committed by GitHub
parent defe334103
commit cc92fc9eea
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

View File

@ -378,6 +378,46 @@ another mixin to inject your styles.
}
<% end %>
### Reassigning Variables
After loading a module, you can reassign its variables.
<% example(autogen_css: false) do %>
// _library.scss
$color: red;
---
// _override.scss
@use 'library';
library.$color: blue;
---
// style.scss
@use 'library';
@use 'override';
@debug library.$color; //=> blue
===
// _library.sass
$color: red
---
// _override.sass
@use 'library'
library.$color: blue
---
// style.sass
@use 'library'
@use 'override'
@debug library.$color //=> blue
<% end %>
This even works if you import a module without a namespace using `as *`.
Assigning to a variable name defined in that module will overwrite its value in
that module.
<% heads_up do %>
Built-in module variables (such as [`math.$pi`]) cannot be reassigned.
[`math.$pi`]: /documentation/modules/math#$pi
<% end %>
## Finding the Module
It wouldn't be any fun to write out absolute URLs for every stylesheet you load,