<BrowserRouter> 없이 Link to를 쓰면 에러가 납니다.

🚨 아래의 가이드라인을 꼭 읽고 질문을 올려주시기 바랍니다 🚨질문 하시기 전에 꼭 확인해주세요
- 질문 전 구글에 먼저 검색해보세요 (답변을 기다리는 시간을 아낄 수 있습니다)
- 코드에 오타가 없는지 면밀히 체크해보세요 (Date와 Data를 많이 헷갈리십니다)
- 이전에 올린 질문에 달린 답변들에 꼭 반응해주세요 (질문에 대한 답변만 받으시고 쌩 가시면 속상해요 😢)질문 하실때 꼭 확인하세요
- 제목만 보고도 무슨 문제가 있는지 대충 알 수 있도록 자세한 제목을 정해주세요 (단순 단어 X)
- 질문의 배경정보를 제공해주세요 (이 문제가 언제 어떻게 발생했고 어디까지 시도해보셨는지)
- 문제를 재현하도록 코드샌드박스나 깃허브 링크로 전달해주세요 (프로젝트 코드에서 문제가 발생할 경우)
- 답변이 달렸다면 꼭 확인하고 반응을 남겨주세요

- 강의의 몇 분 몇 초 관련 질문인지 알려주세요!
- 서로 예의를 지키며 존중하는 문화를 만들어가요.
- 인프런 서비스 운영 관련 문의는 1:1 문의하기를 이용해주세요.  


안녕하세요 강의 정말 감사히 잘듣고 있습니다!
라우트 관련해 질문이 있습니다.

영상처럼 작성했을 때 에러가 납니다.
에러내용

Cannot destructure property 'basename' of 'react__WEBPACK_IMPORTED_MODULE_0__.useContext(...)' as it is null. TypeError: Cannot destructure property 'basename' of 'react__WEBPACK_IMPORTED_MODULE_0__.useContext(...)' as it is null. at LinkWithRef (http://localhost:3000/static/js/bundle.js:38549:5) at renderWithHooks (http://localhost:3000/static/js/bundle.js:25406:22) at updateForwardRef (http://localhost:3000/static/js/bundle.js:27975:24) at beginWork (http://localhost:3000/static/js/bundle.js:30022:20) at HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:15002:18) at Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:15046:20) at invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:15103:35) at beginWork$1 (http://localhost:3000/static/js/bundle.js:34967:11) at performUnitOfWork (http://localhost:3000/static/js/bundle.js:34215:16) at workLoopSync (http://localhost:3000/static/js/bundle.js:34138:9)



전 강의 코드를 따라했을 땐 문제가 없습니다. 영상에 캡쳐된 코드 방식대로 하려면 어떻게 해야 하나요?

 return (
    <div className="App">
      <DiaryStateContext.Provider value={data}>
        <DiaryDispatchContext.Provider
          value={{
            onCreate,
            onUpdate,
            onDelete,
          }}
        >
          <BrowserRouter>
            <Routes>
              <Route path="/" element={<Home />} />
              <Route path="/new" element={<New />} />
              <Route path="/edit/:id" element={<Edit />} />
              <Route path="/diary/:id" element={<Diary />} />
            </Routes>
            <RouterTest />
            <div />
          </BrowserRouter>
        </DiaryDispatchContext.Provider>
      </DiaryStateContext.Provider>
    </div>
  );

+
<RouterTest> 컴포넌트 안에는 Link to 들이 적혀 있습니다.
감사합니다.