使用 node-sass 编译 SCSS 时出现未定义变量错误

Question

package.json

"scripts": {
  "compile:sass": "node-sass sass/main.scss css/style.css -w"
}

main.scss

@import "abstracts/variables";
@import "base/typography";  

_variables.scss

$color-light-grey: #777;
$color-white: #fff;   

_typography.scss

body {
  color: $color-light-grey;
}
.heading-primary {
  color: $color-white;
}

现在我的问题是，当我尝试使用 npm run compile:sass 进行编译时，它会抛出以下错误：

"message": "Undefined variable: \"$color-light-grey\"."

Answer 1

您上面的代码中似乎有两个错误：

• 您导入 "abstracts/variables" 但是，至少在文本中，文件名似乎是 _variables.scss（缺少 "s"）
• 您应该先导入 "abstracts/variables"。

像这样：

@import "abstracts/variables";
@import "base/typography";

Answer 2

转换所有以“_”开头的文件名
示例：
typography.scss >> 到 >> _typography.scss