Tiedostojen tuonti SASS:ssa

Kun työskentelet SASS-tiedostojen kanssa, voi olla tarpeen siirtää koodia .scss-dokumentista, luomatta sen kloonia .css-tunnisteella, eli tuoda sen fragmentin.

Esimerkiksi, meillä on tiedosto navbar.scss, jossa on seuraava koodi:

navbar.scss.active {
  color: red;
}

Jotta voit suorittaa tällaisen tuonnin, sinun on ensin lisättävä alaviiva tiedostonimen eteen, näin: _navbar.scss. Sitten toiseen tiedostoon style.scss kirjoitamme @import-direktiivin, mutta tuotavan tiedoston nimessä alaviivaa ja tiedostopäätettä ei mainita:

style.scss@import "navbar";

Ja näemme, että käännetyssä tiedostossa style.css on tuotu _navbar.scss-tiedoston koodi:

style.css.active {
  color: red; 
}

main.scss.block-content {
  padding: 10px;
  margin-left: auto;
  width: 600px;
  font-size: 14px;
}