본문 바로가기

A.개발관련자료

[0]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

App.js 초기 세팅시 React18 최신버전에서 일어나는 오류

//오류난 코드
import React from "react";
import "./index.css";
import App from "./App";
import { Provider } from "react-redux";
import store from "./features/store";
import ReactDOM from "react-dom";
import { PersistGate } from "redux-persist/integration/react";
import { persistStore } from "redux-persist";

export let persistor = persistStore(store);

ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <PersistGate loading={null} persistor={persistor}>
        <App />
      </PersistGate>
    </Provider>
  </React.StrictMode>,

  document.getElementById("root")
);
//해결코드
import React from "react";
import "./index.css";
import App from "./App";
import { Provider } from "react-redux";
import store from "./features/store";
import ReactDOM from "react-dom/client";
import { PersistGate } from "redux-persist/integration/react";
import { persistStore } from "redux-persist";

export let persistor = persistStore(store);


 const root = ReactDOM.createRoot(document.getElementById("root"));
 root.render(
   <React.StrictMode>
     <Provider store={store}>
       <PersistGate loading={null} persistor={persistor}>
         <App />
       </PersistGate>
     </Provider>
   </React.StrictMode>
 );

 

참고:

https://soa-memo.tistory.com/m/27

https://dev.to/osmanforhad/react-js-warning-reactdomrender-is-no-longer-supported-in-react-18-use-createroot-instead-until-you-switch-to-the-new-api-1jhh

 

React js Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API

Recently i have been working in a React js project its show me an warning in my Browser Console which...

dev.to