为什么要在 SCSS 中的文件名前加上“_”？

当我们在 SCSS 文件前添加“_”时，表示它是 SCSS 的一部分。当编译器获取任何以“_”开头的 SCSS 文件时，它只会忽略该文件。如果您希望在样式中包含此 SCSS 部分，则必须使用 @import。使用部分的优点是您可以使用样式文件来组织您的代码，并且所有文件都将编译在一个文件中。部分 SCSS 的目的是将您的样式分成逻辑部分。
最后，我们希望编译一个 SCSS 文件，而我们可以有许多逻辑部分 SCSS 文件。

句法：

@import filename;

注意：导入时我们不放“_”，只放文件名。

示例 1：让我们创建一个颜色文件 _colors.scss

$first-color: blue;
$second-color: yellow;
  
// let's include it in main
// SCSS file, style.scss
  
@import "colors"; 
body {
  color: $first-color;
  background: $second-color;
}

输出：

body {
  color: blue;
  background: yellow; 
}

示例 2：让我们创建一个颜色文件 _font.scss

$font: arial;
$color: red;
  
// Let's include it in main
// SCSS file, style.scss
  
@import "font";
body {
  font: 100% $font;
  color: $color;
}

输出：

body {
  font: 100% arial;
  color: red;
}