리액트 - pathname 에러 (Router)

🤢에러 내용 :

Uncaught TypeError: Cannot read properties of undefined (reading 'pathname')

콘솔에 이러한 에러가 발생했다

---

 

• 솔루션 1

VSCode 좌측 상단 search 아이콘을 누르면 검색할 수 있다.

(reading 'pathname') 이 출력되어 내가 pathname 설정 했었나?

하고 프로젝트 폴더에서 검색했는데 나오지 않았다..

---

• 솔루션 2

(reading 'pathname') 밑으로 at Router 가 출력되어

Router 컴포넌트를 찾아보기로 했다.

path 를 pathname 으로 변경 해보았고 다시 Routes 와 Route 구문도 구글링하여

다시 작성했으나 효과가 없었다..

 

그러던 중 export default 가 되고 있으니

import 를 따라가 보자고 생각했고

 

그 결과, 에러의 원인을 찾을 수 있었다.

문제의 코드

여기서 App.jsx 파일 2번째 줄,

import Router가 잘 못되어 들어갔다.

 

자동완성으로 react-router-dom 을 가져 왔는데

의도대로 라면 내가 작성해 놓은  Router 파일을 가져와야 했다... 흑

 

자동완성은 가장 많은 비중의 휴먼에러인 오타를 방지할 수 있지만

프로그램 의도와 맞지 않는 부분이 자동완성으로 들어갈 수 있다

 

자동완성도 너무 맹신하지 말고 다시한번 코드를 살펴보자!

---

 

🎈해결 방법 : App.jsx 에서 Router 파일 연결!

 

import Router from "./shared/Router"