Javascript 不必要的花括号

我尝试将postloader与webpack 4一起使用，如下所示：

   test: /\.s?[ac]ss$/,
    use: [
      {
        loader: "css-loader"
      },
      {
        loader: "postcss-loader"
      },
      {
        loader: "sass-loader",
        options: {
          sourceMap: true,
          includePaths: ["node_modules", "node_modules/@material/*"].map(
            d => path.join(__dirname, d)
          )
        }
      }
    ]
  },

我必须包括

节点单元模块

，因为

index.scss

文件：

@import "./Topbar/scss/topbar.scss";
@import "./Sidebar/scss/sidebar.scss";

body {
  margin: 0;
  padding: 0;
}

编译器抱怨：

ERROR in ./src/index.scss
Module build failed: Syntax Error

(1:6) Unnecessary curly bracket

> 1 | body {
    |      ^
  2 |   margin: 0;
  3 |   padding: 0; } 

我做错了什么

更新
我从

test:/\.s？[ac]ss$/

更改为

test:/\.scss$/

，并且

index.scss的内容保持不变：

body {
  margin: 0;
  padding: 0;
}

编译器仍然抱怨：

    ERROR in ./src/index.scss (./node_modules/css-loader!./node_modules/postcss-loader/lib!./node_modules/sass-loader/lib/loader.js??ref--6-3!./src/index.scss)
    Module build failed: Syntax Error

    (1:6) Unnecessary curly bracket

    > 1 | body {
        |      ^
      2 |   margin: 0;
      3 |   padding: 0; }

ℹ ｢wdm｣: Failed to compile.

更新2

这就是整个配置：

const HtmlWebPackPlugin = require("html-webpack-plugin");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const path = require("path");
const glob = require("glob");


module.exports = {
  entry: ["./src/index.js"],
  output: {
    path: path.resolve(__dirname, "dist"),
    filename: "bundle.[hash].js"
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
          options: {
            presets: ["@babel/preset-env", "@babel/preset-react"]
          }
        }
      },
      {
        test: /\.html$/,
        use: [
          {
            loader: "html-loader",
            options: {
              minimize: true
            }
          }
        ]
      },
      {
        test: /\.scss$/,
        use: [
          {
            loader: MiniCssExtractPlugin.loader
          },
          {
            loader: "css-loader"
          },
          /*{
            loader: "postcss-loader"
          },*/
          {
            loader: "sass-loader",
            options: {
              sourceMap: true,
              includePaths: ["node_modules", "node_modules/@material/*", "src"].map(
                d => path.join(__dirname, d)
              )
            }
          }
        ]
      },
      {
        test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
        use: [
          {
            loader: "file-loader",
            options: {
              name: "[name][hash].[ext]",
              outputPath: "fonts/"
            }
          }
        ]
      }
    ]
  },
  plugins: [
    new HtmlWebPackPlugin({
      template: "./public/index.html",
      filename: "./index.html"
    }),
    new CopyWebpackPlugin([
      {
        from: "public"
      }
    ])
  ]
};

从
索引.scss
中删除除导入之外的所有内容，尝试仅加载您正在导入的样式，这可能是由于其他文件中的问题导致的，直到不起作用您正在使用的
includePath
指的是scss文件还是sass文件？问题是加载程序试图用sass语法编译SCS。为什么要将文件测试为sass或SCS？您的项目中有任何sass文件吗？我的项目中没有任何
.sass
文件。我更新了我的帖子，你能把这两个帖子的代码包括在内吗？