Webpack 配置错误 - 请帮我纠正

Question

回购： https://github.com/BraveNewWorld99/reactbootstrap

我在 webpack 5.15.0

我在 powershell 中运行“node index.js”并收到以下错误消息：

ValidationError：无效的配置 object。 Webpack 已使用与 API 模式不匹配的配置 object 进行了初始化。

configuration.module.rules[0] 应该是以下之一： ["..." | object { 编译器？，依赖？，descriptionData？，强制？，排除？，生成器？，包括？，发行者？，发行者层？，层？，加载器？，mimetype？，oneOf？，选项？，解析器？，realResource？，解析？，资源？，resourceFragment？，resourceQuery？，规则？，sideEffects？，测试？，类型？，使用？ }, ...] -> 一条规则。 详细信息：configuration.module.rules[0].loader 应该是一个非空字符串。 -> 加载器请求。

这是我的 webpack.config.js

    module.exports = {
  entry: [
    './main.js',
  ],
  output: {
    path: '/',
    filename: 'main-bundle.js',
  },
  module: {
    rules: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        use: {loader: ['babel-loader']}
      },
      { test: /\.css$/, use: {loader: 'style-loader!css-loader' }},
      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, use: {loader: 'file-loader' }},
      {
        test: /\.(woff|woff2)$/,
        use: {loader: 'url-loader',
        options: {
          prefix: 'font/',
          limit: '5000',
        }}
      },
      {
        test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,
        use: {loader: 'url-loader',
        options: {
          limit: 10000,
          mimetype: 'application/octet-stream',
        }}
      },
      {
        test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,
        use: {loader: 'url-loader',
        options: {
          limit: '10000',
          mimetype: 'image/svg+xml',
        }}
      },
    ],
  },
};

Answer 1

您的第一条规则定义错误。 您已经设置了一个数组，而不是配置中的字符串。 试试： loader: 'babel-loader' 。

  {
    test: /\.jsx?$/,
    exclude: /node_modules/,
    use: {loader: 'babel-loader'}
  },