[ReactJS] react_dom_client__WEBPACK_IMPORTED_MODULE_1___default.a.render is not a function 오류 해결

상황

npm start해서 서버를 돌리는데 빈 화면이 뜨는 것이었다. 그래서 콘솔을 확인해보니 다음과 같은 오류가 떴다.

 

react_dom_client__WEBPACK_IMPORTED_MODULE_1___default.a.render is not a function

 

그리고 내 index.js 코드는 다음과 같았다.

import React from 'react';
import ReactDOM from 'react-dom/client';

import './index.css';
import App from './App';

ReactDOM.render(<App />, document.getElementById('root'));

 

 

해결

index.js 코드를 다음과 같이 바꿔주자.

import React from 'react'; 
import ReactDOM from 'react-dom/client'; 

import App from './App';
import './index.css';

const root = ReactDOM.createRoot(document.getElementById('root')); root.render(<App /> );

제대로 나온 모습을 확인할 수 있다. 

 

 

참고 출처

https://www.reddit.com/r/learnreactjs/comments/vmtbiu/how_come_reactdomrender_doesnt_work/

How come ReactDOM.render() doesn't work?