I am trying to reinstall an old project from react but am getting weird errors that I don't understand. I tried to change the version of react to newer but didn't work. I am currently using npm 8.11.0 and node v16.15.1
Related
I'm developing a frontend for my API using Next JS and Typescript. I have made changes to the code that has caused this a Type Error to occur whenever I attempt to build, run in dev mode or lint.
Usually this would be fairly easy to debug - however the type error is not present in my own files but instead Next JS's:
Any help would be appreciated.
Thanks in advance!
The issue was caused by a version mismatch between react-dom and the other NextJS packages - I'd removed react-dom as a dependency as I was unaware that NextJS depended on it, so when it was added again it downloaded the latest version "^18.0.0" instead of "17.0.2".
Remove next and reinstall it. It will install the latest version of next and correct react version.
npm uninstall next
npm install next
Disclaimer: this is my first question on Stack Overflow, so apologies if it's not formatted correctly. Please let me know how I can improve it or if more details are needed.
I tried to install styled-components for my React app with the following command npm install --save styled-components.
Before I did this, my server started up just fine with npm start.
After install, React tries to start up the development server but it stops and returns the following errors:
cacheEntry.sizeOnlySource = new SizeOnlySource(size);
TypeError: SizeOnlySource is not a constructor
at updateFileWithReplacementSource (project-directory/node_modules/webpack/lib/Compiler.js:756:37)
at updateWithReplacementSource (project-directory/node_modules/webpack/lib/Compiler.js:738:8)
at processMissingFile (project-directory/node_modules/webpack/lib/Compiler.js:801:8)
at project-directory/node_modules/webpack/lib/Compiler.js:843:10
at Immediate.<anonymous> (project-directory/node_modules/memfs/lib/volume.js:698:17)
Initially, I tried uninstalling the styled-components package. Same errors. Then, I tried updating webpack with npm update webpack.
I googled the errors but they were all for problems that seemed unrelated or that are now fixed.
Support Webpack 4.29.0 breaking change
output.futureEmitAssets option breaks compatibility with source map upload plugins
library target umd - Uncaught TypeError: x is not a constructor
I did come across a post on Stack Overflow explaining that --save is no longer necessary as of npm version 5.0.0. Perhaps it's the source of the error?
Note that I installed the styled-components package on a separate branch of my project, but the server still won't start when I switch to the main branch and I'm getting the same errors.
Honestly, I have no idea what's going wrong or how to fix it. Any help or guidance would be greatly appreciated.
Edit: before the Starting development server... line I get after running npm start, there's some kind of message about webpack being deprecated. I hadn't noticed that before, but it flashes by too quickly for me to read it and I can't scroll up to see the message. I created a new React project from scratch to see if the server would start. It does, but I'm still getting the aforementioned messages.
React version: 16.8.6
React-table version: 7.6.3
Hey. I am getting the next error only when trying to build my project.
When running it locally, everything works fine and the hook is being imported, but when trying to build it, I am getting: 'useTable' is not exported by node_modules/react-table/index.js.
Saw some code examples, and I am doing everything exactly the same as them. Tried to remove my node_modules and reinstall everything- but it didn't work.
Any help???
Thanks!!
This is the way I am importing the component:
This is the error I am getting after the build fails:
I've created a new react app using create-react-app. running npm start compile the app and opens the hello react page on localhost://3000, but any change to the project and saving nothing happens.
in the chrome console there is the following error:
Error handling response: Error: Failed to construct 'WebSocket': The URL 'ws/ws' is invalid.
at init (chrome-extension://fiegdmejfepffgpnejdinekhfieaogmj/reload.js:22:18)
at chrome-extension://fiegdmejfepffgpnejdinekhfieaogmj/reload.js:65:13
I'm using Visual studio on Macbook
npm version 6.14.8
node version 14.15.1
react version 17.0.1
(Angular cli project re-compile without a problem)
Deleting the app and running create-react-app again solved the problem.
The initial screen looks different though - so maybe it was a version compatibility issue.
I have installed Jest v17.0.3 in my react project.
When I run jest locally it works fine, but on the build server it fails with:
Error: Cannot find module 'react/lib/ReactComponentTreeHook' from 'ReactDebugTool.js'
Both machines are running node version 6.9.1 and npm version 4.0.2.
use same version of react and react-dom. My problem fixed after using this command
npm install --save react#15.4.0 react-dom#15.4.0
this problem specially occurs on react 15.4.0 above.
Can you check which version of React you are using? Is it the same on both servers? I would try removing node_modules and reinstalling the dependencies. The reason I am suggesting this is that in React v15.4.0 you cannot import private apis and it seems that ReactDebugTools.js is trying to import from react/lib/....
From the blogpost about React v15.4.0 (Link):
However, there is a possibility that you imported private APIs from react/lib/*, or that a package you rely on might use them. We would like to remind you that this was never supported, and that your apps should not rely on internal APIs. The React internals will keep changing as we work to make React better.
Hope this helps!
In the latest versions of react we often see this error as we have loaded 2 versions of react:
To make sure you have just 1 version, run the following in your terminal:
npm ls react-dom
npm ls react
Both the react and react-dom versions need to be same.
If any one of these returns more than 1 version then that's not supported. You have to then correct it in your corresponding package.json
I had the same issue and i removed the node_modules and ran npm install and it fixed the problem.