본문 바로가기

React

[React] 리액트 버전 다운그레이드

서버를 만드는 도중에 리액트 18버전에서는

 

여러가지 종속성 문제가 발생하였습니다.

 

서버를 구축해서 몽고db를 연결해 보고 싶은데

 

생각대로 되지 않네요.

 

그래서 버전을 다운그레이드 해서 진행해보려고 합니다.

 

react 18에서 17.0.2로 다운그레이드하는 방법 - DEV Community

 

How to downgrade from react 18 to 17.0.2

I might not be the only one who is really scared of change in technology causing a break in my code,...

dev.to

 

링크로 걸어둔 페이지를 참고하였습니다.

 

가장 많이 쓰는 버전인 17.0.2버전으로 바꿔보겠습니다.

npx create-react-app .

 

먼저 프로젝트를 하나 만들어주고

 

npm uninstall react react-dom

 

종속성 문제 때문에 18버전의 리액트와 리액트 돔을 삭제시켜 주어야 합니다.

 

npm install react@17.0.2 react-dom@

 

 

다음 바꾸고 싶은 버전을 react-dom@ 다음에 적어주시면 됩니다.

 

npm install react@17.0.2 react-dom@17.0.2

 

// react 18

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './App';
import reportWebVitals from './reportWebVitals';

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

// If you want to start measuring performance in your app, pass a function
// to log results (for example: reportWebVitals(console.log))
// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
reportWebVitals();

 

기존 index.js에 있던 코드들입니다.

 

// react 17.0.2

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';

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

 

이렇게 바꿔주시면 끝입니다.

 

터미널을 열고

 

npm start

 

실행 시켜보면

 

localhost:3000

 

성공적으로 다운그레이드 된 모습을 보실 수 있습니다.

 

 

 

서버를 다루면서 수없이 많은 에러들을 마주하고 있는데

 

부디 문제가 해결되면 좋겠네요.

 

 

'React' 카테고리의 다른 글

[React] 라우팅 복습  (0) 2024.02.19
[React] 프로젝트를 위한 React 세팅 - ES7  (0) 2024.02.18
[React] useReducer 복습  (0) 2024.01.30
[React] API 연동  (1) 2024.01.29
[React] 투두리스트 로그인 구현하기2  (0) 2024.01.22