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';

Comments

No Comments Yet.
Be the first to tell us what you think.
Sass for beginners
Sass for beginners

Are you learning Sass ? Try our test we designed to help you progress faster.

Test yourself

Chat

Oh, the operator is not available. Leave us your comments. We will answer all your questions as soon as possible.

Comments

Anonymous
Καλησπέρα.
Anonymous
the infinteis -3/15 so 1triition / infinet
Anonymous
e
Anonymous
<a href="https://inspirum.pl "
Anonymous
[url]https://inspirum.pl[/url]
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e
LaceJaguar65
e