Webpack sass-loader未配置任何加载程序来处理此文件

Question

对不起，我知道有无数其他线程遇到同样的问题，但是我尝试了所有解决方案，但没有成功。我只是试图用webpack编译scss文件，但是当我这样做时出现错误：

./css/source/main.scss 3：0中的

错误 模块解析失败：意外字符'@'（3：0） 您可能需要适当的加载程序来处理此文件类型，当前没有配置任何加载程序来处理此文件。

const path = require('path');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

module.exports = {
  output: {
    path: path.resolve(__dirname, '../dist')
  },
  module: {
    rules: [
      {
        loader: 'babel-loader',
        test: /\.js$/,
        exclude: /node_modules/
      },
      {
        test: /\.scss$/,
        use: [
          "style-loader",
          MiniCssExtractPlugin.loader,
          "css-loader",
          "sass-loader"
        ]

      }
    ]
  }
};

Answer 1

请尝试以下格式

{
    test: [/.css$|.scss$/],
    use: [
      MiniCssExtractPlugin.loader,
      "css-loader",
      "postcss-loader",
      "sass-loader"
    ]
 }