Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

After nx upgrade I start to get error in storybook ReactDOM.render is no longer supported in React 18

See original GitHub issue

Current Behavior

I get this error ReactDOM.render is no longer supported in React 18 in story book after I used this commands nx migrate latest and then nx migrate --run-migrations

Expected Behavior

I expected that if I’m using the command for upgrade nx project in my example it update react from 17 to 18 and update the story book as well it should work without error about ReactDOM.render is no longer supported in React 18

Steps to Reproduce

Take an nx project with react version 17.x.x and has story book
execute this command nx migrate latest
execute this command nx migrate --run-migrations
execute this command nx run <project name>:storybook
open chrome dev tools and you will see

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot

Failure Logs

Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot

Environment

Issue Analytics

State:
Created a year ago
Reactions:1
Comments:5 (5 by maintainers)

Top GitHub Comments

1reaction

jaysoocommented, Jun 8, 2022

Looks like the issue is on the storybook side. If you only see the error once, then it is supposed to be fine.

https://github.com/storybookjs/storybook/issues/17831#issuecomment-11

Closing this since the issue is somewhat resolved, and remaining problem with Storybook Manager is something that needs to be done on their end.

0reactions

mandarinicommented, Jun 8, 2022

Thank you @jaysoo for helping out, here!

Top Results From Across the Web

ReactDOM.render is no longer supported in React 18 - Stack ...

To resolve it, you can either revert to a previous version of React or update your index.js file to align with the React...

ReactDOM.render is no longer supported in React 18

The error "ReactDOM.render is no longer supported in React 18. Use createRoot instead" occurs because the `ReactDOM.render` method has been deprecated.

[Solved] ReactDOM.render is no longer supported in React 18

The ReactDOM.render is no longer supported in React 18 occurs due to the deprecation of ReactDOM.render in the React 18 version.

Test runner Addon | Storybook: Frontend workshop for UI ...

Features; How it works; Getting started; CLI Options ... For stories without a play function, it verifies whether the story rendered without any...

React 18 Migration | Nx

If you use npm v7/v8, you will need to use npm install --force after running nx migrate 14.0.0 since @testing-library/react-hook does not support...