javascript - 使用 node-sass 编译 CSS 时格式无效

Question

使我的页面响应时出现错误。我正在使用@mixin 来实现这一点。

@mixin mediaSm{
  @mixin screen and (max-width:768px) {
    @content;

  }
}

@mixin mediaMd{
  @mixin screen and (max-width:500px) {
    @content;

  }
}
@mixin mediaLg{
  @mixin screen (min-width:769px) and (max-width:1170px) {
    @content;

  }
}
@mixin mediaSm{
  @mixin screen and (min-width:500px) {
    @content;

  }
}

我收到一条错误消息，提示格式错误，应该在 'and' 之后有 '{'。我使用的是 Ubuntu，但相同的代码在 Windows 10 中没有显示出某种错误。

{ "status": 1, "file": "/opt/lampp/htdocs/my_portfolio/scss/_config.scss", "line": 34,
"column": 10, "message": "Invalid CSS after \" @mixin screen\": 预期 \"{\", 是 \"and (max-width:768p\"", "formatted": "Error: Invalid CSS after \" @mixin screen\": 预期 \"{\ ", 是 \"and (max-width:768p\"\n 在 scss/_config.scss 的第 34 行\n 从 scss/main.scss 的第 1 行\n>> @mixin 屏幕和 (max-width:768px ){\n\n ---------^\n" }