SASS - 將 scss 文件引用到 main.scss 文件以更改 main.css

Question

我正在使用 SASS 並且我有不同的 scss 文件來描述我的網頁上的布局，例如我的_navbar.scss和_footer.scss文件（也有沒有下划線的main.scss文件）。

現在我想將我的所有布局 scss 文件引用到我的 main.scss 以便我的 main.css 將獲得 styles 用於 main.scss 文件中引用的所有內容。 由於不再使用@import，有人知道該怎么做嗎？ 我需要一些擴展或工具嗎？

這是 HTML 代碼。

<section class="navbar" id="nav">
            <ul>
                <li><a class="linkbox">Test</a></li>
                <li><a class="linkbox">Test</a></li>
                <li><a class="linkbox">Test</a></li>
                <li><a class="linkbox">Test</a></li>
            </ul>
    </section>


    <section class="footer">
        <div class="box">
            <div class="header">Footer</div>
        </div>
    </section>

這是我的文件夾結構。 文件夾結構

Answer 1

查看@use。

https://sass-lang.com/documentation/at-rules/use

@use 規則從其他 Sass 樣式表加載 mixins、函數和變量，並將來自多個樣式表的 CSS 組合在一起。 @use 加載的樣式表稱為“模塊”。 Sass還提供了功能齊全的內置模塊。