การนำเข้าแบบซ้อนใน SASS

โดยปกติแล้ว @import จะถูกใช้ตอนต้นของเอกสาร แต่โปรเซสเซอร์ SASS อนุญาตให้นำเข้าไฟล์ ในส่วนใดก็ได้ของไฟล์ที่เราต้องการ แม้กระทั่ง ภายในตัวเลือก

ลองพิจารณาตัวอย่างต่อไปนี้:

main.scss.active {
  color: blue;
}

จากนั้นนำเข้าไฟล์นั้นในไฟล์ style.scss:

style.scssdiv {
  @import "main";
}

ตอนนี้มาดูผลลัพธ์ของการคอมไพล์:

style.cssdiv .active {
  color: blue; 
}

navbar.scss.link {
  color: red;
  font-size: 12px;
}