Summary
You can create a partial Sass file by adding an underscore to the beginning of the filename, like this: _colors.scss. To load a partial into another Sass file, use the following syntax at the top of your file:
@use 'colors';Details
You can split up your Sass code into multiple files and still have one CSS file in the end using partials and imports.
You can create a partial Sass file by adding an underscore to the beginning of the filename. An example name could be _colors.scss.
The partial file will not be compiled into its own CSS file. Instead, to use the code you import it into a normal Sass file that will be compiled.
To import a partial into another Sass file, you can use the following syntax at the top of your file:
@use 'colors';Notice that you don’t need to include the underscore or the .scss file extension.
The @use rule applies Dart Sass 1.23.0 and above. Older versions of Dart Sass used the @import rule, but that is now deprecated.
Exercises
Try importing the _fonts.scss file in main.scss.