-
Notifications
You must be signed in to change notification settings - Fork 2.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[Feature]: React 18 Support #577
Comments
✅ Things I've tried so far that seem to work:
|
❌ Can't install the beta on npm 7 because of peer dep mismatch with Npm errornpm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: @remix-run/react@1.0.4 npm ERR! Found: react@18.0.0-beta-149b420f6-20211119 npm ERR! node_modules/react npm ERR! react@"18.0.0-beta-149b420f6-20211119" from the root project npm ERR! peer react@"18.0.0-beta-149b420f6-20211119" from react-dom@18.0.0-beta-149b420f6-20211119 npm ERR! node_modules/react-dom npm ERR! react-dom@"18.0.0-beta-149b420f6-20211119" from the root project npm ERR! npm ERR! Could not resolve dependency: npm ERR! peer react@">=16.8" from @remix-run/react@1.0.4 npm ERR! node_modules/@remix-run/react npm ERR! @remix-run/react@"^1.0.4" from the root project npm ERR! npm ERR! Conflicting peer dependency: react@17.0.2 npm ERR! node_modules/react npm ERR! peer react@">=16.8" from @remix-run/react@1.0.4 npm ERR! node_modules/@remix-run/react npm ERR! @remix-run/react@"^1.0.4" from the root project npm ERR! npm ERR! Fix the upstream dependency conflict, or retry npm ERR! this command with --force, or --legacy-peer-deps npm ERR! to accept an incorrect (and potentially broken) dependency resolution. |
I'm not completely clear on where this work would be done, it's possible that some of these practices would need to be baked into Remix and others left up to the user to do inside of the entry module. |
❌ 🐛 I think I've found a bug.
|
I keep getting the error references in #2564 with
|
Same here using |
Closing this as there should be no issues running React 18. Our templates do still install 17 by default, so you need to follow the upgrade guide until we decide to upgrade by default. If you have any specific problems with React 18, please open a new issue! |
@chaance the app doesn't work with |
I upgraded to React 18 using |
I confirm this works: |
There's also an unreleased update in React that should fix issues with hydrating the root document. If you install
|
@chaance - I'll take a look in in the evening and let you know! Thanks for the repro 👍 |
React 18.2.0 is released with the fix, so I think there should be no more blockers. |
Hi @chaance, I tried to run your repo with 18.1.0 and 18.2.0. I am seeing the following warning and error messages in the console. Not sure if I am doing something wrong: Also to add, the behavior with 18.1.0 and 18.2.0 is somewhat different. With 18.1.0, the main page appears for about 1 second and then disappears - I see a white screen. With 18.2.0, the app is more stable - the main page does not disappear. Regardless, the above errors appear in the console regardless of version 18.1.0 or 18.2.0. |
I've seen these errors too. Go to a incognito mode in your browser and check if you see them there. If not, then it's probably a extension like dark mode (my case), apollo dev tools, etc that you may have installed and those are the ones injecting some things in the dom causing the mismatch. I've found some discussion #24430. My specific case was a dark mode extension in chrome |
@benjaminhonorio, you hit the nail on the head! That was exactly the issue. The errors go away in an Incognito window. Thanks so much for your help. |
The Apollo Client Devtools chrome extension causes this error for me. |
What is the new or updated feature that you are suggesting?
Support React 18 features, perhaps this issue can be used as a tracking issue?
Why should this feature be included?
React 18 is the future...
The text was updated successfully, but these errors were encountered: