SASS将utils导入到所有文件，但只有一次

Question

有没有什么办法可以将@import某些带有通用mixin和关键帧的文件（utils.scss）添加到所有其他scss文件？

// main.scss, this file is linked in html: <link rel="stylesheet" href="main.scss">. 
@import "home.scss"; 
@import "about.scss"; 

// home.scss 
@import "utils.scss"; 
... 

// about.scss 
@import "utils.scss"; 
... 

// utils.scss 
@keyframes fade-in { 
    from { opacity: 0; } 
    to { opacity: 1; } 
} 

这没关系，一切正常，但有utils.scss更多次，结果文件：

// Result 
@keyframes fade-in { 
    from { opacity: 0; } 
    to { opacity: 1; } 
} 

@keyframes fade-in { 
    from { opacity: 0; } 
    to { opacity: 1; } 
} 

当utils.scss具有100 KB（含压缩），我有20个文件，其中utils.scss进口，有1,9 MB冗余代码，因为有20次是utils.scss。

Answer 1

把utils从个人.scss文件中取出并放在main.scss文件之前的其他文件。

// main.scss 
@import "utils"; 
@import "home.scss"; 
@import "about.scss";