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'}
  },