使用 node-sass 编译 SCSS 时出现未定义变量错误 [英] Getting Undefined variable error when compiling SCSS using node-sass

问题描述

package.json

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

ma​​in.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 进行编译时，它会引发以下错误:

Now my issue is when I'm trying to compile with npm run compile:sass it throws the following error:

"message": "未定义变量:\"$color-light-grey\"."

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

推荐答案

看起来你上面的代码有两个错误:

Looks like there are two errors in your code above:

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

• You import "abstracts/variables" but, at least in the text, the file name seems to be _variables.scss (missing an "s")
• You should import "abstracts/variables" before everything else.

像这样:

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

这篇关于使用 node-sass 编译 SCSS 时出现未定义变量错误的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！