React version mismatch when creating new projects #2040
Comments
|
Hi all, getting same error with MacBook Pro M1. I also tried with previous Hydrogen versions up to 4.0 without success. Following complete error log prompted on my terminal: |
|
This started to happen to me yesterday, after I update mini-oxygen to 3.0.1, I will try to downgrade to 3.0.0, maybe this would fix the problem again. |
|
I'm getting the same: Tried running:
Neither worked and returned the same error |
|
After downgrading, it's working again. |
|
@jamalsoueidan I tried to create a new project with Hydrogen 3.0.0 but it's not working as expected What am I doing wrong? |
|
You are not doing something wrong, we need to wait until Monday to get it fixed. |
|
Not working for me even if I downgrade.. builds won't compile. Hope a fix is ready Monday morn 😬 |
|
I was able to revert back to old package-lock 7 days ago, and then do npm ci, it will download exactly same packages I had before, and it's working. |
Hi @jamalsoueidan can you share more details about versions that are working for you? I need to have a working hydrogen project as soon as possible... Thank you in advance |
|
[https://github.com/jamalsoueidan/booking-store/package-lock.json This is my package-lock. |
|
@jamalsoueidan |
because the link at the start [ sorry |
|
Looks like this issue might have something to do with having multiple versions of react. Looks to me that hydrogen-react is using 18.0.0 while all the other packages involved with hydrogen are using 18.2.0. I managed to force hydrogen-react to use react and react-dom 18.2.0 and it seems to all be working as intended. Had to fork the repo and install it that way but it looks to now be working. |
|
@SpoonAndBirdcage it seems working now but I have this errors in the app: |
|
following.... |
|
Not seeming to work yet...
Port 3000 is in use, trying another one... Environment variables injected into MiniOxygen: SESSION_SECRET from local .env ➜ Local: http://localhost:3001/ Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
React will try to recreate this component tree from scratch using the error boundary you provided, InternalApp. ERROR Cannot read properties of null (reading 'useState') node_modules/@shopify/cli-kit/node_modules/react/cjs/react.development.js:1622:21 |
|
following |
Question - since @shopify/hydrogen@2024.4.1 is only a few days old, was it ever working for anybody else for creating a new project? Would like to understand the root cause and risk of future regressions of this nature. |
|
I can confirm that last week I spun up a new project without issues. Today I tried the same and promptly ran into this error. |
|
I don't know where this is heading 😕. Has anyone taken any action to resolve this issue? I need to sort this out, so any progress update would be much appreciated. Thanks, everyone 😀. |
|
HI folks, just ensuring that this issue have the attention of the team and we are working on re-producing and coming up with solution. Thank you all for your patience. |
|
Anyone getting this warning after starting dev?
I tried running
Codegen is just not working for some reason. |
@mhmdjaw please create a different issue. |
|
An upstream dependency mismatch is found in @shopify/cli-kit and had been reported to appropriate team. |
|
Please inform me (reply here) if this issue been resolved. |
|
Here is a hotfix, which anybody can use to unblock themselves. Clone, install, and invoke the create tool directly. |
|
After some research, it looks like this is something that needs to be fixed properly in For the time being, we've added a better error when this happens: The current workaround is to run |
frandiox
changed the title
This issue still happening while updated to the latest version of dependencies with the commands as follows : But this issue has solved and no problems without update latest version of dependencies and just run the command as follow : Anyways, this issue of React version mismatched still happening with I'd updated with commands as follows : Version Details as follow : Here is the errors on my system as follow: Port 3000 is in use, trying another one... Environment variables injected into MiniOxygen: SESSION_SECRET from local .env ➜ Local: http://localhost:3001/ Warning: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
React will try to recreate this component tree from scratch using the error boundary you provided, InternalApp. ERROR Cannot read properties of null (reading 'useState') node_modules/@shopify/cli-kit/node_modules/react/cjs/react.development.js:1622:21 1619: }
› Warning: Could not find ts-node at /usr/local/var/www/gitHub/hydro-storefront/node_modules/@shopify/cli/dist/index-e6f8190d.js. Please |
|
The fix is now released and 🗒️ that you will see cc HeisUser |
|
Thank you 🕺🏻 |
Yes~ I'd stated.. But those dependencies not the latest version. |
Which dependencies are you talking about specifically? |
|
Working great, thanks all! |
I have this exact issue. Have followed Di you find a solution? |
I was able to solve it somehow by upgrading hydrogen and oxygen related packages. Just try upgrading all the packages in the hydrogen read me file. |
The issue is fixed for the latest version of skeleton template (when you create a new project) |
I totally agree, and we need to simplify how everything works. |
EDIT: See current workaround in #2040 (comment)
What is the location of your example repository?
New
Which package or tool is having this issue?
Hydrogen
What version of that package or tool are you using?
2024.4.1
What version of Remix are you using?
2.9.1
Steps to Reproduce
Background:
macOS Sonoma 14.2.1 (23C71)
Node v20.12.2
Steps to reproduce
npm create @shopify/hydrogen@latestyto installExpected Behavior
Create a Hydrogen app
Actual Behavior
The text was updated successfully, but these errors were encountered: