I have read through a ton of posts on this and cannot find a solution. I built the app with Create-React-App so I didn't have to think about Babel/WebPack. I recently upgraded my dependencies and ran into this issue. The error is fairly lengthy, but here is the first part of bundle.js error...
Uncaught Error: Module build failed (from ./node_modules/babel-loader/lib/index.js):
TypeError: .../src/StudentDashboard/ClientApp/node_modules/history/index.js: Cannot read properties of undefined (reading 'originalPositionFor')
The app is React on the fron end and .Net Core on the back end. I start the SPA from startup.cs with...
if (env.IsDevelopment())
{
spa.UseReactDevelopmentServer(npmScript: "start");
}
I have tried:
"presets": ["@babel/preset-env", "@babel/preset-react"]
"@babel/core": "^7.17.0",
"@babel/preset-env": "^7.16.11",
"@babel/preset-react": "^7.16.7",
"babel-loader": "^8.2.3",
None of the above fixed the error. I even closed and restarted VS Code just in case. Any thoughts on how to fix would be appreciated.
This error comes when you install the latest version of npm like this npm install react-router-dom@6 after running npm start it will fail to compile because of @babel/core is incompatible with the npm version so you have to revert back to babel previous versions run this:
npm i -D @babel/core@7.16.12
the stop your development server and restart again
I figured out the issue I was facing. While the error displayed pointed me towards Babel, which is what I thought, the real issue was related to changes to React routing.
I had to wrap all my <route> elements in a <Routes> tag. I then had to change the component attribute to element and place the component in html-like syntax...from {Home} to {<Home/>}.
One other change was that my import was pulling from react-router. I changed it to react-router-dom.
This was all in my App.js.
Here are a couple of links that might be helpful to others who, like me, did not realize there was a change.
This is caused by @jridgewell/trace-mapping - a dependency of @babel/core, You can update it to fix the problem.
Reference link：
[Bug]: Breaks react-router-dom #14229