Importera filer i SASS

När man arbetar med SASS-filer kan det vara nödvändigt att flytta kod från ett .scss-dokument, men utan att skapa en klon av det med tillägget .css, d.v.s. importera en del av det.

Till exempel, vi har en fil navbar.scss med följande kod:

.active {
	color: red;
}

För att genomföra den här typen av import måste du först lägga till ett understreck före filnamnet, så här: _navbar.scss. Sedan i en annan fil style.scss skriver vi direktivet @import, men i namnet på den importerade filen anges inte understrecket eller filtillägget:

@import "navbar";

Och vi ser att vid kompilering till style.css importerades koden från filen _navbar.scss:

.active {
	color: red; 
}

Skapa en fil main.scss med följande innehåll:

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

Importera sedan en del av den till filen styles.scss och kompilera till styles.css.