ReactDOM.render is no longer supported in React 18 콘솔에러 질문드립니다

react-dom.development.js:86 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

이라는 콘솔에러가 계속 뜨길래 구글링을 하여 

import React from 'react';
import ReactDOM from 'react-dom/client';
import App from './layouts/App';

const rootElement = document.getElementById('root');
if (!rootElement) throw new Error('Failed to find the root element');
const root = ReactDOM.createRoot(rootElement);

root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
);

로 코드를 바꿔서 실행하니 local이 성공적으로 켜지긴하지만 

이렇게 어마어마한 에러가 출력됩니다

제가 어느부분의 코드를 잘못작성하여 이렇게 뜨는지 모르겟습니다 🤔

import React from 'react';
import { createRoot } from 'react-dom/client';
import { BrowserRouter } from 'react-router-dom';
import App from './layouts/App';

const container = document.getElementById('app');
const root = createRoot(container!); // createRoot(container!) if you use TypeScript

root.render(
  <BrowserRouter>
    <App />
  </BrowserRouter>,
);