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 Junior -
How do you modularize your project stylesheets using Sass?
Sass Junior -
What are partials in Sass?
Sass Junior -
What is a difference between Sass and CSS?
Sass Junior -
What is scale-color() function good for in Sass?
Sass Junior