Typescript 网页包不生成嵌套的SCS

我有一个相当简单的网页文件，它采用一些typescript+scs并处理它。 我注意到，当我有嵌套的SCS时，webpack根本不会将其转换为css。我在传输的文件中没有它的数据。但当我有了无嵌套的SCS时，一切都按预期工作

    .my-gallery {
      border: 2px solid blue;
    }

    .my-gallery-img {
      border: 2px solid red;
    }

例如，这是我的SCS，它不是用我的webpack配置构建的

.my-gallery {
  border: 2px solid red;
  &-img {
    border: 2px solid blue;
  }
}

然而，当我有这样的SCS时，一切都按预期进行

    .my-gallery {
      border: 2px solid blue;
    }

    .my-gallery-img {
      border: 2px solid red;
    }

在我的网页配置中，我可能做错了什么？下面我附上了我的当前配置和我的开发依赖项

const path=require（“路径”）；
const MiniCssExtractPlugin=require（“迷你css提取插件”）；
module.exports={
条目：[“/app/main.ts”]，
手表：没错，
模式：“生产”，
输出：{
文件名：“[name].js”，
path:path.resolve（uu dirname，“static”）
},
模块：{
规则：[
{
//将es6+js&ts转换为es5 js。
测试：[/.js$|.ts$/]，
排除：/（节点\模块）/，
使用：{
加载器：“巴别塔加载器”，
选项：{
预设：[“@babel/preset env”，“@babel/typescript”]
}
}
},
{
//将SCS转换为css，缩小它，通过POSTSS应用autoprefixer
测试：[/.css$|.scss$/]，
使用：[
MiniCssExtractPlugin.loader，
“css加载器”，
“sass加载器”，
“邮政编码加载器”
]
}
]
},
决心：{
扩展名：[“.js”、“.ts”]
},
插件：[
新的MinicsSextract插件({
//将所有样式写入单个style.css文件。
文件名：“css/[name].css”
})
]
};

---

我想更新一下。我发现我的模板里有点东西。我的网页配置没有问题

.my-gallery {
  border: 2px solid red;
  &-img {
    border: 2px solid blue;
  }
}

在我的模板中，我不小心在类名中放入了一个

“

<div class="my-gallery">
  {{ range $i, $imgsrc :=  $.Page.Params.Images }}
  <div class="my-gallery-img""> <!-- right here --> 
    <img 
      class="lazy"
      src="/img/placeholder.png"
      data-src="{{$imgsrc}}" alt="">
  </div>
  {{ end }}
</div>

{{range$i，$imgsrc:=$.Page.Params.Images}