webpack＆＃x2B; Babel：模块解析失败

Question

我正在尝试让WebPack与Babel合作，并做出反应以使我的.jsx文件转移到.js以在Web浏览器中使用，但我失败了。

我的webpack.config.js：

module.exports = {
    mode: 'production',
    entry: './src/pages/',
    output: {
        path: '/pathToMyProj/__assets',
        filename: '[name].js',
        uniqueName: 'myProject'
    },
    module: {
        rules: [
            {
                test: /(\.jsx|\.js)$/,
                include: `${process.cwd()}/src/**/*.jsx`,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ["@babel/preset-react",  "@babel/preset-env"]
                    } 
                }
            }
        ]
    },
    resolve: {
        modules: ['node_modules/**/*'],
        extensions: ['.jsx', '.js'],
    },

    experiments: {
        topLevelAwait: true
    }
}

我的.babelsrc：

{  
    "presets": ["@babel/preset-env", "@babel/preset-react"],
    "plugins": [],
    "comments": false,
    "compact": true
}

我的软件包

{
  "dependencies": {
    "@babel/preset-env": "^7.18.2",
    "@babel/preset-react": "^7.17.12",
    "axios": "^0.27.2",
    "babel-loader": "^8.2.5",
    "babel-preset-es2015": "^6.24.1",
    "path": "^0.12.7",
    "react": "^18.1.0",
    "react-dom": "^18.1.0",
    "webpack": "^5.72.1"
  },
  "devDependencies": {
    "webpack-cli": "^4.9.2"
  }
}

。 email＆nbsp;受保护] ，以某种方式WebPack无法识别JSX语法，并且正在抛出错误：

ERROR in ./src/pages/index.jsx 21:4
Module parse failed: Unexpected token (21:4)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders

|     toRender = 
>     <p><br />Welcome<br /><a href="/manage">Test</a><br /><br />Not you? <a href="/logoff">Log off</a></p>
|     }
|   } else {

webpack 5.72.1 compiled with 1 error in 231 ms

我该如何解决？