1

I recently switch to react 18 and also find out that reactDOM.render is depreciated. I change accordingly and now My index.js is looked like

import React from "react";
import { createRoot } from "react-dom/client";
import "./index.css";
import { ChakraProvider } from "@chakra-ui/react";
import App from "./App";

const root = createRoot(document.getElementById("root"));
root.render(
  <React.StrictMode>
    <ChakraProvider>
      <App />
    </ChakraProvider>
  </React.StrictMode>
);

And the react app is working fine but this error is generated to console every time my app is re-rendered. I've tried to fix this by :-

  1. Restart the app
  2. const root = ReactDOM.createRoot(document.getElementById('root'));
  3. Delete the package-lock.json and then reinstall it.

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.

Could this be a version issue because my app is in no way affected by this warning? I'm working on these versions

"react": "^18.2.0",
"react-chips": "^0.8.0"
"react-dom": "^18.2.0",

But It's kinda annoy me if anyone knows something about it then please help.

Thank you

Praval Jindal
  • 11
  • 4

1 Answers1

1

Update the version of @chakra-ui/react. Older version will not work with react18. Error will be vanished after new version of @chakra-ui/react.

Pooja Gupta
  • 21
  • 3