React项目配置Webpack构建报错求助

各位大佬好！我正在用npm给我的React项目手动配置Webpack，结果运行npm run build构建的时候遇到了一个错误，折腾好久都没解决，想请大家帮忙看看问题出在哪😭

具体报错信息 #

执行npm run build后，终端输出的错误内容如下：

assets by status 364 bytes [cached] 1 asset
./src/index.js 224 bytes [built] [code generated] [1 error]

ERROR in ./src/index.js 7:12
Module parse failed: Unexpected token (7:12)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.
| const rootElement = document.getElementById('root');
| const root = createRoot(rootElement);
> root.render(<App />);
|

webpack 5.93.0 compiled with 1 error in 357 ms

我的Webpack配置文件 #

目前我的webpack.config.js配置如下（原代码片段有截断，后续会补充完整）：

// 此处为webpack.config.js的配置代码

备注：内容来源于stack exchange，提问作者Klarc Almeida