SASS Modules and Imports 2 — Questions and Answers
Question 1: What is the `@forward` directive used for in Sass?
- To forward HTTP requests
- To re-export members from one module through another (Correct answer)
- To send variables to a mixin
- To create a link between two Sass files
Correct answer: To re-export members from one module through another
The `@forward` directive makes the public members of another Sass file available to consumers that `@use` the current file.
Question 2: What is the difference between `@use` and `@forward`?
- `@use` makes members available in the current file; `@forward` makes them available to files that `@use` the current file (Correct answer)
- They are identical
- `@forward` is an older version of `@use`
- `@use` only works for partials
Correct answer: `@use` makes members available in the current file; `@forward` makes them available to files that `@use` the current file
`@use` imports members for use in the current file, while `@forward` passes them through so importing files can access them.
Question 3: How do you hide specific members when using `@forward`?
- @forward 'file' except $var
- @forward 'file' hide $var (Correct answer)
- @forward 'file' exclude $var
- @forward 'file' without $var
Correct answer: @forward 'file' hide $var
The `hide` keyword with `@forward` prevents specific members from being re-exported: `@forward 'file' hide $secret`.
Question 4: How do you expose only certain members when using `@forward`?
- @forward 'file' include $var
- @forward 'file' expose $var
- @forward 'file' show $var (Correct answer)
- @forward 'file' export $var
Correct answer: @forward 'file' show $var
The `show` keyword with `@forward` whitelists specific members to be re-exported: `@forward 'file' show $public`.
Question 5: Why is `@import` being deprecated in Sass?
- It doesn't support SCSS syntax
- It causes global namespace pollution and makes dependency tracking difficult (Correct answer)
- It is too slow to compile
- It doesn't work with CSS custom properties
Correct answer: It causes global namespace pollution and makes dependency tracking difficult
`@import` puts all variables, mixins, and functions in the global scope and re-executes files each time they are imported, making large projects fragile.
Question 6: What happens if you `@use` the same file twice in Sass?
- An error is thrown
- The file is loaded and executed twice
- The file is loaded once; subsequent uses reference the same module (Correct answer)
- The second `@use` is silently ignored and a warning is shown
Correct answer: The file is loaded once; subsequent uses reference the same module
Sass's module system ensures each file is loaded and executed only once, even if `@use`d multiple times, preventing duplication.
SASS Modules and Imports 2
What is the `@forward` directive used for in Sass?