• Back to Job Interview Question listing

What is @import keyword good for in 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