SASS 的节点和 Gulp - 堆栈级别太深答案

【问题标题】：Node & Gulp for SASS - Stack level too deepSASS 的节点和 Gulp - 堆栈级别太深
【发布时间】：2017-01-04 22:30:40
【问题描述】：

尝试使用 Gulp 将我的 SASS 编译成 .css 文件以前用指南针，想改用 Gulp。下面的这个 mixin 不是我创建的，但正在使用中。头文件之一确实使用了 mixin bp（做一个断点）

当从 Gulp 运行 sass 编译时，这些问题有时会发生，有时不会。并不总是复制相同的确切位置。我还删除了 css 文件，并重新编译时出现此错误。 css 还在那里，似乎可以工作。我该怎么办？想法？

插件“sass”中的错误

消息： afa/scss/layout/_header-search.scss

SystemStackError: 堆栈级别太深
              on line 41 of afa/scss/layout/_header-search.scss
---> @include bp(最小宽度, $bp-medium + 1) { ---------^

下面是文件本身的 Mixin

// =============================================
// Mixin - Breakpoint
// =============================================

$mq-support: true !default;
$mq-fixed-value: 1024px !default;

@mixin bp($feature, $value) {
    // Set global device param
    $media: only screen;

    // Media queries supported
    @if $mq-support == true {

        @media #{$media} and ($feature: $value) {
            @content;
        }

        // Media queries not supported
    } @else {

        @if $feature == 'min-width' {
            @if $value <= $mq-fixed-value {
                @content;
            }
        } @else if $feature == 'max-width' {
            @if $value >= $mq-fixed-value {
                @content;
            }
        }

    }
}

/*
// ----------------------------------------------
// Usage example:
// For IE set $mq-support to false.
// Set the fixed value.
// Then use mixins to test whether styles should be applied.
// ----------------------------------------------

$mq-support: false;
$mq-fixed-value: 1024;

// Renders at fixed value
@include bp (min-width, 300px) { 
    div { color:#000; }
}

// Doesn't render without MQ support
@include bp (min-width, 1200px) { 
    div { color:#FFF; }
}

// Doesn't render without MQ support
@include bp (max-width, 300px) { 
    div { color:#444; }
}

// Renders at fixed value
@include bp (max-width, 1200px) { 
    div { color:#888; }
}

// ----------------------------------------------
*/

这是来自 _header-search.scss 文件的调用

@include bp(min-width, $bp-medium + 1) {

    .skip-search {
        display: none;
    }

}

【问题讨论】：

您使用的是哪个版本的sass 插件？您可以运行npm list --depth=0 进行检查。我可以通过更新到最新的包来修复我的构建中的这个错误，但我使用的是gulp-sass。
gulp@3.9.1, gulp-sass@3.0.0, gulp-util@3.0.8, node-delete@0.1.2 -- 你认为 3.0.0 需要更新吗？
gulp-sass 的 3.1.0 版已为我修复。
@Mike，会检查的。
@MikeWheaton 这行得通，你能发帖作为答案，我会接受吗？

标签： node.js sass gulp

【解决方案1】：

事实证明，这个错误是由 sass-gulp 包的过时版本引起的。如果其他人遇到此问题，请尝试更新到 3.1.0 或更高版本。

【讨论】：

sass-gulp 还是 sass-gulp ？