网页包+；sass加载程序：在“…”之后的CSS无效-宽度：$small）“：“预期”；{quot；，was"；'；

我一直在寻找这个神秘错误的答案，但我真的不知道该去哪里寻找。显然，有一个令人不快的媒体查询选择器，但它似乎和我迄今为止发现的任何其他媒体查询示例一样正常。（另外，我对媒体查询不是很在行，真的，但我认为它们格式良好）：

我得到的错误是：

Module build failed: 
@media only screen and (min-width: $small)
                                        ^
      Invalid CSS after "...-width: $small)": expected "{", was ";"
      in /path/to/mediaqueries.sass (line 6, column 42)

当我使用webpack进行传输时，我遇到了这个错误。我使用了一堆加载程序来处理样式表。处理.sass文件的webpack配置为：

{
      test: /\.sass$/,
      loaders: ["style", "css?sourceMap", "postcss", "resolve-url",  "sass?sourceMap"]
    }

到目前为止，这个加载程序的设置对我来说很好，所以我认为问题不存在

---

我尝试删除这组规则（带有媒体查询的规则）其余的sass代码似乎没有问题。有什么提示我应该去哪里找吗？谢谢你的帮助。

如评论中所述，你需要通过sass加载程序选项传入

缩进语法：true

，以便

节点sass

使用

缩进语法进行编译

示例

{
  test: /\.sass$/,
  loaders: ["style", "css?sourceMap", "postcss", "resolve-url",  
  {
    loader: "sass-loader",
    options: {
      sourceMap: true,
      indentedSyntax: true
    }
  }]
}

small media query是新的媒体查询还是与medium media query相同？@DenisTsoi、
$small
和
$medium
是在媒体查询之前定义的sass变量。它们只存储大量像素。我怀疑节点sass（这是sass加载程序的依赖项）正在使用scss而不是sass进行检查（我在codepen上检查了您的代码，一切似乎都很好）您需要传入选项：{indentedSyntax:true}用于sass加载程序Web包（节点sass将此作为默认设置关闭）Throoze-这有帮助吗？
{
  test: /\.sass$/,
  loaders: ["style", "css?sourceMap", "postcss", "resolve-url",  
  {
    loader: "sass-loader",
    options: {
      sourceMap: true,
      indentedSyntax: true
    }
  }]
}