我有一个关于故事书的问题。我不能启动故事书，我有一个关于我的SCSS文件的错误。
这是一个错误：
ModuleParseError：模块解析失败：意外的标记（1：0）
您可能需要一个适当的加载程序来处理此文件类型，目前没有加载程序配置为处理此文件。请参阅https://webpack.js.org/concepts#loaders {|颜色：红色;|地址：/myproject/node_modules/@storybook/builder-webpack4/node_modules/webpack/lib/NormalModule.js：469：19
我的意思是这只是一个简单的类，但是当文件是空的时候，编译是可以的，所以我不明白我怎么能解决这个问题。
我的SCSS文件

.h1 {
  color: red;
}

字符串
我的Webpack文件

const webpack = require('webpack');
const path = require('path');

module.exports = {
  mode: 'development',
  entry: path.resolve(__dirname, './src/index.js'),
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,
        exclude: /node_modules/,
        use: ['babel-loader'],
      },
      {
        test: /\.scss?$/,
        exclude: /node_modules/,
        use: ['style-loader', 'css-loader', 'sass-loader']
      },
      {
        test: /\.(png|jpe?g|gif)$/i,
        loader: 'file-loader',
        options: {
          name: '[path][name].[ext]',
        },
      },
    ],
  },
  resolve: {
    extensions: ['*', '.js', '.jsx'],
  },
  output: {
    path: path.resolve(__dirname, './dist'),
    filename: 'bundle.js',
  },
  plugins: [new webpack.HotModuleReplacementPlugin()],
  devServer: {
    contentBase: path.resolve(__dirname, './dist'),
    hot: true,
  },
};

型
.storybook文件夹中的main.js文件

module.exports = {
  "stories": [
    "../src/**/*.stories.mdx",
    "../src/**/*.stories.@(js|jsx|ts|tsx)",
    "../src/**/**/*.stories.@(js|jsx|ts|tsx)"
  ],
  "addons": [
    "@storybook/addon-links",
    "@storybook/addon-essentials"
  ]
}

型
有没有人有解决办法？提前谢谢