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:
- running babel-upgrade with npx
- Adding babel.config.json with
"presets": ["@babel/preset-env", "@babel/preset-react"]
- Adding dev dependencies of
"@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.
CodePudding user response:
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.
https://dev.to/gabrlcj/react-router-v6-some-of-the-new-changes-181m
https://www.c-sharpcorner.com/article/react-router-v6-what-changed-and-upgrading-guide/
CodePudding user response:
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
