What is @import keyword good for in Sass?
Experience Level: Junior
Tags: Sass
Answer
Using the keyword @import you can include Sass partials (smaller files with Sass snippets) into the main Sass file.
The @import keyword is used to merge multiple Sass files into one larger one.
_buttons.scss
$primary: blue;
$error: red;
button {
background-color: $primary;
color: white;
border: none;
}
button.error {
background-color: $error;
color: white;
border: none;
}
_dialogs.scss
.dialog {
border: solid 1px gray;
border-radius: 15px;
padding: 15px;
}
styles.scss
@import 'buttons';
@import 'dialogs';
Related Sass job interview questions
What structure do you use to make Sass stylesheets well organized and maintainable?
Sass JuniorHow do you modularize your project stylesheets using Sass?
Sass JuniorWhat are partials in Sass?
Sass JuniorWhat is a difference between Sass and CSS?
Sass JuniorWhat is scale-color() function good for in Sass?
Sass Junior