Webpack 试图在网页包中包含一些CSS是错误的

看，我的文件夹结构是这样的：

• js
  • bundle.js
  • custom.js
• css
  • main.css
• style.css
• app.js
• webpack.config.js

我把我的索引链接到app.js，问题是webpack配置无法编译fils（显然），我的意思是让事情变得更清楚：

var path = require('path');

module.exports = {
    mode: 'development',
    entry: './app.js',
    module: {
        rules: [
        { 
            test: /\.css$/, use: [ 'style-loader', 'css-loader' ],
            include: [
            path.resolve(__dirname, 'js/custom.js'),
            path.resolve(__dirname, 'js/owl-carousel.js'),
            ]
        }
        ]
    },
    output: {
        path: path.resolve(__dirname),
        filename: 'bundle.js'
      }
};

它不断地告诉我一个错误：

我的app.js上有这个：

require('./style.css');

---

在某些方面我错了吗？

使用MiniCssExtractPlugin加载程序，它将提取CSS并写入新的CSS文件

var MiniCssExtractPlugin=require（“迷你css提取插件”）； 在您的网页包配置中添加以下内容：

rules: [

   {
      test: /\.js$/,
      exclude: /node_modules/,
      use: {
        loader: 'babel-loader'
      }
    },
    {
      test: /\.css$/,
      use:  [  'style-loader', MiniCssExtractPlugin.loader, 'css-loader']
    }
  ]
}
plugins: [
  new MiniCssExtractPlugin({
    filename: 'style.css',
  }),

让我知道问题仍然存在