Bootstrap：覆盖背景颜色

Question

这是我的文件结构：

│   styles.scss
│   _bootstrap-overrides.scss
│   _global.scss
│   _mixins.scss
│   _nav.scss
│   _resume-item.scss
│   _variables.scss

主文件为styles.scss：

// Core variables and mixins
@import "variables.scss";
@import "mixins.scss";
// Global CSS
@import 'bootstrap/scss/bootstrap.scss';
@import "global.scss";
@import "nav.scss";
@import "resume-item.scss";
@import "bootstrap-overrides.scss";

如您所见，我导入了*.scss个文件和bootstrap。

一切正常，我的意思是，背景颜色为橙色：

但是，我现在已将这些文件移到scss文件夹中：

│   styles.scss
├───scss
│       _bootstrap-overrides.scss
│       _global.scss
│       _mixins.scss
│       _nav.scss
│       _resume-item.scss
│       _variables.scss

进入_variables.scss：

$primary:       $orange !default;

但是，背景颜色为蓝色：

有什么想法吗？

Answer 1

我有一个概念

$body-bg: 

你需要弄乱变量吗？检查你的变量scss文件。

Answer 2

将这些文件移动到scss文件夹后，您是否更改了“styles.scss”？

可能会是这样的：

// Core variables and mixins
@import "scss/variables.scss";
@import "scss/mixins.scss";
// Global CSS
@import 'bootstrap/scss/bootstrap.scss';
@import "scss/global.scss";
@import "scss/nav.scss";
@import "scss/resume-item.scss";
@import "scss/bootstrap-overrides.scss";