未定义的 scss 变量错误

Question

我正在尝试编译我的 SCSS，但我遇到了一个非常莫名其妙的 gulp 错误。

所以我检查了我的代码，一切看起来都很好。这是我的 _colors.scss 文件中的变量。

// dark shades
$gray1:         #3c3c3d !default;
$gray2:         #5a5a5b !default;
$gray3:         #7d7d7e !default;

这是在 _base.scss 中触发错误的行

body{
  box-sizing: border-box;
  color: $gray1;
  font-family: $base-font;
  font-size: $font-size;
  line-height: $line-height;
  min-height: 100%;
  position: relative;
}

这是我运行的 gulpfile css 任务。

gulp.task('css', function() {
    return sass('scss/**/*.scss')
        .pipe(sourcemaps.init())
        .pipe(autoprefixer())
        .pipe(concat('styles.css'))
        .on('error', sass.logError)
        .pipe(sourcemaps.write())
        .pipe(gulp.dest('./css'))
            .pipe(notify({ message: 'Wait for it....wait for it!!!' }));
});

我所有的代码也都在this repository 中，以防你想四处逛逛（还不算多）

Answer 1

你是否在 _base.scss 之前包含了 _collors.scss