SASS में फ़ाइलों को आयात करना

SASS फ़ाइलों के साथ काम करते समय .scss दस्तावेज़ से कोड स्थानांतरित करना आवश्यक होता है, लेकिन .css एक्सटेंशन के साथ इसकी क्लोन फ़ाइल बनाए बिना, यानी इसके एक हिस्से को आयात करना।

उदाहरण के लिए, हमारे पास navbar.scss फ़ाइल है जिसमें निम्नलिखित कोड है:

.active {
	color: red;
}

इस प्रकार का आयात करने के लिए पहले फ़ाइल के नाम से पहले अंडरस्कोर जोड़ना होगा, इस तरह: _navbar.scss। फिर दूसरी फ़ाइल style.scss में @import निर्देश लिखते हैं, लेकिन आयात की जाने वाली फ़ाइल के नाम में अंडरस्कोर और फ़ाइल एक्सटेंशन नहीं बताते हैं:

@import "navbar";

और हम देखते हैं कि कंपाइल होने पर style.css में _navbar.scss फ़ाइल का कोड आयात हो गया है:

.active {
	color: red; 
}

main.scss फ़ाइल बनाएं जिसमें निम्नलिखित सामग्री हो:

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

फिर इसके एक हिस्से को styles.scss फ़ाइल में आयात करें और styles.css में कंपाइल करें।