Cannot read properties of undefined (reading 'ReactCurrentDispatcher'
Hello, I have migrated from 0.16 to 0.17 and then to 0.18. "wasp start" does not show any error/warning. But, I am receiving a new error in console:
Uncaught TypeError: Cannot read properties of undefined (reading 'ReactCurrentDispatcher')
at chunk-BMJTAGSY.js?v=9cd9bb03:1384:59
at ../../../node_modules/react-dom/cjs/react-dom.development.js (chunk-BMJTAGSY.js?v=9cd9bb03:21585:9)
at require (chunk-V4OQ3NZ2.js?v=9cd9bb03:11:50)
at ../../../node_modules/react-dom/index.js (chunk-BMJTAGSY.js?v=9cd9bb03:21597:24)
at require (chunk-V4OQ3NZ2.js?v=9cd9bb03:11:50)
at ../../../node_modules/react-dom/client.js (react-dom_client.js?v=1be1e259:12:13)
at __require (chunk-V4OQ3NZ2.js?v=9cd9bb03:11:50)
at react-dom_client.js?v=1be1e259:38:16
49 Replies
Hi @tzefar. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
The error you're seeing, "Cannot read properties of undefined (reading 'ReactCurrentDispatcher')", typically points to a React version mismatch or a double installation of React in your project. This can happen if multiple versions of React are being resolved by your app, which is a known issue in some Wasp setups, especially after migrations or restructuring.
From the knowledge sources, there is a related issue where a double installation of React caused similar errors, resulting in a white screen and console errors. The suggested temporary fix was to delete the redundant React installation and Vite's cache, then restart the app. Specifically, running a script to clean up node_modules and Vite's cache resolved the issue in that context. The root cause was that different parts of the app (SDK, user code, web app code) might resolve different React installations, especially after significant changes or merges in the project structure. The maintainers recommend investigating how React is being resolved in your project and ensuring only one version is used throughout the app. This issue is being tracked and discussed further in the Wasp repository, particularly in the context of restructuring and SDK changes Solve double installation issue in restructuring.
What you can try:
1. Delete your node_modules and lock files (package-lock.json or yarn.lock).
2. Clear Vite's cache if applicable.
3. Reinstall dependencies and restart your app.
If the problem persists, check for multiple React versions in your dependency tree and ensure all parts of your app (including SDK and generated code) are using the same React version.
If you continue to experience issues, please provide more details about your project structure or share a reproducible example, as suggested by the Wasp community in similar troubleshooting threads.
Let me know if you need more specific steps or if you encounter any other errors during this process.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @tzefar, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?
@kapa.ai Can you give bash commands for what I can try?
Let me check the knowledge base for you again. One moment! :books:
----------------------
Certainly! Based on the knowledge sources, here are the bash commands you can try to resolve issues related to double React installations or corrupted dependencies after migration:
This process is recommended in several support threads and documentation as a way to resolve issues with corrupted or mismatched dependencies, especially after migrations or when encountering errors related to React or the SDK General CLI Reference Discord: double React issue.
If you still encounter issues, you may want to check for multiple React versions in your dependency tree, but the above steps are the standard first approach recommended by the Wasp community.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @tzefar, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?
Same error: chunk-7RVIPSSU.js?v=192bde6b:1384 Uncaught TypeError: Cannot read properties of undefined (reading 'ReactCurrentDispatcher')
at chunk-7RVIPSSU.js?v=192bde6b:1384:59
at ../../../node_modules/react-dom/cjs/react-dom.development.js (chunk-7RVIPSSU.js?v=192bde6b:21629:9)
at require (chunk-V4OQ3NZ2.js?v=192bde6b:11:50)
at ../../../node_modules/react-dom/index.js (chunk-7RVIPSSU.js?v=192bde6b:21641:24)
at require (chunk-V4OQ3NZ2.js?v=192bde6b:11:50)
at ../../../node_modules/react-dom/client.js (react-dom_client.js?v=261f530d:12:13)
at require (chunk-V4OQ3NZ2.js?v=192bde6b:11:50)
at react-dom_client.js?v=261f530d:38:16
@kapa.ai same error: chunk-7RVIPSSU.js?v=192bde6b:1384 Uncaught TypeError: Cannot read properties of undefined (reading 'ReactCurrentDispatcher')
at chunk-7RVIPSSU.js?v=192bde6b:1384:59
at ../../../node_modules/react-dom/cjs/react-dom.development.js (chunk-7RVIPSSU.js?v=192bde6b:21629:9)
at require (chunk-V4OQ3NZ2.js?v=192bde6b:11:50)
at ../../../node_modules/react-dom/index.js (chunk-7RVIPSSU.js?v=192bde6b:21641:24)
at require (chunk-V4OQ3NZ2.js?v=192bde6b:11:50)
at ../../../node_modules/react-dom/client.js (react-dom_client.js?v=261f530d:12:13)
at require (chunk-V4OQ3NZ2.js?v=192bde6b:11:50)
at react-dom_client.js?v=261f530d:38:16
Let me check the knowledge base for you again. One moment! :books:
----------------------
Based on the knowledge sources, the error "Cannot read properties of undefined (reading 'ReactCurrentDispatcher')" after migration is most likely caused by a double installation of React or a version mismatch, which is a known issue in Wasp projects after restructuring or migration. This can happen if both your app and the Wasp SDK (or generated code) resolve different React installations, leading to runtime errors in the browser.
The recommended steps from the Wasp community and maintainers are:
1. Clean all generated and installed files:
2. Restart your app to reinstall dependencies:
This process is suggested as a temporary fix for double React installation issues, as described in the open issue about restructuring and double installations. The maintainers also note that this problem can occur after major changes or merges, and that cleaning up and reinstalling dependencies often resolves it. If the issue persists, it may be necessary to further investigate how React is being resolved in your project and ensure only one version is present throughout the app. This is an ongoing topic in the Wasp repository and is being tracked for a more permanent solution Solve double installation issue in restructuring.
If these steps do not resolve your issue, the knowledge sources do not provide additional troubleshooting steps specific to this error. In that case, you may need to provide a minimal reproducible example to the Wasp community for further assistance.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
Sorry @tzefar, I seem to be having a bit of trouble. Don't worry though, I've pinged my support and they will try to fix me up! :technologist:
Perhaps try again in 15mins?
I have done all this. I have executed wasp clean and removed package-lock. My versions are correct. But the same error appears: Uncaught TypeError: Cannot read properties of undefined (reading 'ReactCurrentDispatcher')
I ran nto this today too. I've been going crazy thinking I caused it, but I can't resolve it.
I am encountering the same issue, glad I am not alone.
I have been doing so well today, and then boom it stopped working.
I also tried a new project from scratch, and the same was happening.
Something in the dependency chain must have updated
did you try starting a new project on your side?
i have not. but i've added far too much code to this project to abandon it
Wohooo @sabotage, you just became a Waspeteer level 1!
Just to see if it is wasp itself, because I was able to replicate the issue with a new install, I cleaned up everything and reinstalled Wasp
well if you can do it on a fresh install that really points towards an issue in the dependency chain
im going to start comparing my package-lock.json to a known working one
I did just try a new app (from 0.16.4) and encountered the same issue
not sure why, but adding "@tanstack/react-query": "^4.39.1" to the dependencies unblocked me.
was a different versoin for me but that did resolve the issue. thanks for that
Well, it worked for a bit and then reverted to the same issue after clean reinstall..
yeah if you wipe out your package.json youll have to put that back in
this isn't the first time this package has broke wasp. i thought the devs were going to pin it... but something didn't happen
I also had toclean the "npm cache clean --force" before reinstalling
Wohooo @playfulhay, you just became a Waspeteer level 1!
Getting same issue
My site went down, client is not being server on domain
Same Here
i added this to my package.json:
"resolutions": {
"@tanstack/query-core": "4.29.0",
"@tanstack/react-query": "4.29.0"
}
your specific wasp version might need a different version but it'll complain on startup
so this is a temp fix?
depends. if you regularly upgrade wasp, a new release will prolly address it. if you're on an older version, think it'll be required goign forward
yeah i am still on 0.16
yeah im in 0.16.4, so.. consider it a permanent change
doesn't work in my case,
Even after i did npm i again.
you do it on the client or the server?
Wohooo @sabotage, you just became a Waspeteer level 2!
in the main directory json file
where's it running, locally or on a server somewhere?
locally
it's a change that affects the client webapp, so if you just added it to package.json in the root and npm install i dont think it would have affected the client version
try wasp start
but having same issue on my Live project as well which was deployed via a VPS
tried no luck
try a clean?
Trying now.
Pretty sure many will be facing the same issue.
Hope someone from the team gives Clarity on what happened...
similar things have happened before. im assuming, but im guessing something in the dependency chain had a package that wasn't pinned and was upgraded, which broke wasp. they can fix it in new versions by pinning specific versions in package.json, but since you're stuck on an old version.. it's not going to fix you
After clean getting a new error regarding tailwind --
[plugin:vite:css] [postcss] It looks like you're trying to use
tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss and update your PostCSS configuration.do you have an old version of package-lock.json in source somewhere. you might be able to diff it out and see what's chaned
no luck,
Only changes are what i tried for fixing tailwind errors.
@Filip
Can we confirm there's not a dependency outage somewhere?
Multiple users facing same issue.
a user tried a new project and still faced same issue.
So I'd compare package-lock.json, not package.json. the lock file has the full dependency chain and odds are this is something wasp isn't explicitly requiring
Hey fellas, it's currently night in Europe so guys aren't working and I'm away from my device.
So let me just tag the @Wasp Team and someone will check it out ASAP
Hey, unfortunately this happened when most of the team is sleeping.
I'm currently working on resolving this issue.
Thank you so much.
While I work this out a quick fix is:
1. Use
wasp deps to see which version of react-query you need for your wasp version (image 1)
2. Add that line to you dependencies in your package.json file:
e.g.
3. Using wasp start now should update deps and it should work.
Let me try this.
Tailwind shouldn't be related to this problem.
You should try to see if your setup matches the one from the docs:
https://wasp.sh/docs/0.16.0/project/css-frameworks
I sent docs for 0.16.0 but you can change the version.
CSS Frameworks | Wasp
Tailwind
Thanks i need for 0.16 only.
Can confirm this worked.
Thanks @sabotage for helping out here!
So we pinned it last time in the hotfix, but then we decided to relax it a bit, since it was really a freak situation (react-query releasing broken release, happens never), and we wanted people to be able to get any useful/security updates that react-query might be releasing.
We discussed it more in this GH issue https://github.com/wasp-lang/wasp/issues/2830, the releavnt quote is this:
This is probably most relevant: What makes this tricky is that on one hand we want people to get the newest versions of packages Wasp uses, like react-query, but on the other hand, there is always a chance of one of these packages making a mistake like this, even if they are just releasing a patch. But on the other hand you want patches in case they are fixing a security issue. Solution is actually not to pin them down completely, but to give you some freedom on choosing the version yourself in the rare case when something goes wrong like this. But this requires some smart design on our side. We will be thinking about this soon.Btw in this case it doesn't seem to be react-query's fault neccessarily, but combo of change they did and our expectations and Vite and what not, still looking into that, just wanted to not put unneccesary blame on react-query. The complete solution is most likely: us not pinning completely but with
~ + allowing users to specify exact version if they want and using that one in that case + support proper dependency freezing.
We are actually working at the moment on refactoring parts of Wasp that will make this stuff easier https://github.com/wasp-lang/wasp/pull/3159, and we weren't pushing the "final" solution too much because we wanted to have these other changes in place first + it happened only twice in 4 years. But after this I do think we will look into speeding it up.
Short report on our side: @toticozeni is producing new wasp versions with a fix for last couple of Wasp releases, while @Carlos is investigating the details of the cause (we know enough to fix it now but still need to understand some intricacies so we can prevent it from ever repeating). And in the meantime there is a hotfix you can apply right now that @toticozeni shared here and in #🔒💬general .