inflearn logo
강의

講義

知識共有

MERN STACK コミュニティ: 開始から配布まで通知するReact

react-router-dom

React-router-dom을 설치하고 react app이 크롬에서 실행되지 않습니다.

379

drogba

投稿した質問数 4

0

똑같은 버전 설치하고, 코딩을 따라서 입력했는데

BrowserRouter을 사용한 후로 크롭에서 실행되지 않습니다.

해결방법이 있을까요?

 

스크린샷 2023-08-13 오후 11.16.13.png

react node.js mongodb express firebase

回答 1

0

communityai8509

안녕하세요, 인프런 AI 인턴이에요. React-router-dom을 설치하고 React 앱이 크롬에서 실행되지 않는다는 문제에 대해 도움을 드리겠습니다.

React-router-dom은 React에서 브라우저를 위한 라우팅 기능을 제공하는 패키지입니다. 이 패키지를 사용하려면 몇 가지 설정이 필요할 수 있습니다. 아래의 해결 방법을 참고하시면 도움이 될 수 있을 것입니다.

  1. React-router-dom의 최신 버전을 설치한 것인지 확인해주세요. 가장 최신 버전인 6.x.x 버전을 설치하는 것을 권장합니다. 터미널에서 npm install react-router-dom@latest 명령어를 입력하여 설치하실 수 있습니다.

  2. BrowserRouter 컴포넌트를 사용하기 위해서는, React 애플리케이션의 최상위 컴포넌트로 BrowserRouter를 감싸주어야 합니다. BrowserRouter 컴포넌트는 브라우저의 HTML5 History API를 사용하여 페이지를 제어합니다. 예를 들어, App.js 파일에서 아래와 같이 작성해보세요.

import { BrowserRouter, Route, Switch } from 'react-router-dom';
import Home from './Home';
import About from './About';

function App() {
  return (
    <BrowserRouter>
      <Switch>
        <Route exact path="/" component={Home} />
        <Route path="/about" component={About} />
      </Switch>
    </BrowserRouter>
  );
}

export default App;
  1. BrowserRouter 컴포넌트를 사용한 후에도 크롬에서 실행되지 않는다면, 크롬 개발자 도구를 열어 콘솔(console) 탭을 확인해보세요. 에러 메시지나 경고가 표시되는지 확인해볼 수 있습니다. 문제의 원인을 찾기 위해 콘솔에 출력된 내용을 확인해보시기 바랍니다.

만약 위의 방법들로 문제가 해결되지 않는다면, 더 자세한 정보가 필요합니다. React 앱의 코드 일부분 또는 에러 메시지를 공유해주시면 더 정확한 답변을 드릴 수 있을 것입니다.

Heroku 데이터로드 문제.

0

179

2

몽고DB

0

168

1

No routes matched location Error Component Stack error 질문입니다.

0

574

1

axios 문제 404에러

0

2113

1

도와주세요

0

451

3

네이버 클라우드를 사용하지 않는 사람은 외부저장소~env 까지 따라하지 않아도 되죠?

0

235

0

두번씩 실행되는 문제..

0

460

1

스타일 깃허브에서 코드 가져가라고 하셨는데요

0

462

2

read(2) 강의 내용에 질문이 있습니다.

0

265

1

깃허브

0

343

1

마지막에 "" 로 채워주는 이유가 있을까요?

0

283

1

Detail.js CSS 관련 강의가 없어진거 같은데요 ?

0

280

1

504 에러

0

851

1

콘솔에 DOM이라는 로그가 뜨는데

0

284

1

useEffect 두번 사용하는 것

0

923

1

작동은 잘되는데 오류가 뜹니다

0

438

1

react-router-dom 현재 최신버전

0

612

1

Test.js 소스코드 볼 수 있을까요?

0

489

2

닉네임 중복검사 시 404 에러

0

506

1

수정 버튼 눌렀을 때 이전 이미지 경로

0

434

1

이미지 수정이 안되고 이전 이미지 경로가 안떠요 ㅜㅜ

0

559

1

upload에서 제출 시 오류

0

612

2

여기 학습에 필요한 css 이거 어디에 있나요?

1

613

1

useEffect 요런거 눌르면 자동으로 ()=>{ ) 어런식으로 자동완성 되자나요? 그거어떻게 하나요? ㅠㅠ

1

551

1