JS/React

📚 [React] 리액트 라우터 돔 설정 (react-router-dom)

Nyanggu 2023. 1. 26. 11:07

* react-router-dom v5 사용 (v6를 사용 할 경우 오류 발생)

 

터미널 경로가 리액트를 설치한 프론트단으로 되어있어야 함.  아래 npm으로 react-router-dom 설치

npm install react-router-dom --save

 

package.json에서 react-router-dom 버전이 아래와 같이 5가 아닌 6이라면 해당 명령어로 다운그레이드

npm i react-router-dom@5.2.0

 

 


App.js에서 react-router-dom을 import 시켜주고 라우터 설정

 

 <Router>
    <Switch>
      <Route exact path="/" component={LandingPage}></Route>
      <Route exact path="/login" component={LoginPage}></Route>
      <Route exact path="/register" component={RegisterPage}></Route>
    </Switch>
</Router>