SCSS mixins无法正常运行Foundation overrides

Question

我在使用它时单独导入基础组件，但我很难以有组织的方式自定义基础全局变量。

我有一个foundation-components.scss文件，我导入并包含所有必要的组件。这是它的外观：

// foundation-components.scss
@import '../bower_components/foundation-sites/scss/foundation';
@import '../assets/fonts/foundation-icons/foundation-icons.css';
@include foundation-global-styles;
@include foundation-grid;
@include foundation-button;
@include foundation-button-group;
@include foundation-forms;
@include foundation-visibility-classes;
@include foundation-close-button;
@include foundation-tooltip;

现在我尝试添加一些自定义项以包含在mixins中，以便我可以将我的文件保持井井有条，例如：

@import '../bower_components/foundation-sites/scss/foundation';
@import '../assets/fonts/foundation-icons/foundation-icons.css';

@mixin custom-foundation-settings {
    $tooltip-background-color: white;
}

@mixin foundation-components {
    @include foundation-global-styles;
    @include foundation-grid;
    @include foundation-button;
    @include foundation-button-group;
    @include foundation-forms;
    @include foundation-visibility-classes;
    @include foundation-close-button;
    @include foundation-tooltip;
}

@include custom-foundation-settings
@include foundation-components

这不起作用。但如果我全局定义$tooltip-background-color: white，它确实如此。这有效：

@import '../bower_components/foundation-sites/scss/foundation';
@import '../assets/fonts/foundation-icons/foundation-icons.css';

$tooltip-background-color: white;

@mixin foundation-components {
    @include foundation-global-styles;
    @include foundation-grid;
    @include foundation-button;
    @include foundation-button-group;
    @include foundation-forms;
    @include foundation-visibility-classes;
    @include foundation-close-button;
    @include foundation-tooltip;
}

@include foundation-components;

为什么呢？我不明白为什么将自定义变量放在mixin中不起作用。