[질문/기타] ts2769 no overload matches this call. //BrowserRouter 호출하면서 생긴 오류

[Gomdorydory]

🍥 질문사항 또는 도움요청 사항

안녕하세요? 검색했는데, 방법이 나오지 않아 질문드립니다...

저서 128쪽에 react-router-dom을 통해 BrowserRouter을 가져오면 다음과 같은 오류가 뜹니다. 혹시 해결 방법이 있을까요?

[hwasurr]

질문 감사드립니다!

리액트 버전 혹은 리액트 라우터 버전에 따른 타입오류인 것으로 예상됩니다. 혹시 project/web/package.json 파일의 모든 내용을 첨부해주실 수 있으실까요?

[jjugwen]

안녕하세요, 저도 같은 오류가 있었는데요, 라우터 버전을 책과 동일하게 설치했는데도 컴파일 오류가 있었습니다. 여러 방법을 시도하다가... web 서버(3000포트)를 껐다 켰는데, 오류없어지고 정상적으로 작동했습니다!

[reyoucat]

저도 같은 문제가 발생했네요. react를 설치하면서 버전명시를 안했더니 사용하는 법이나, 디펜던시가 달라졌나 봅니다. 차크라-UI 도 마찬가지로요.

음... 급하게 해결은 리엑트라우터돔을 5.1.8 이 아니라, 6.0.8 (일단 6이상으로 올리고)

exact는 라우터v6 에서 지원하지 않으니 지워주고

<BrowserRouter>
        <Routes>
               <Route path="/" element={<Main />} />
        </Routes>
 </BrowserRouter>

로 바꾸고 실습을 따라해볼게요.

{
  "name": "web",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@apollo/client": "^3.7.3",
    "@chakra-ui/react": "^2.4.6",
    "@emotion/react": "^11.10.5",
    "@emotion/styled": "^11.10.5",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^14.4.3",
    "@types/jest": "^28.1.8",
    "@types/node": "^12.20.55",
    "@types/react": "^18.0.26",
    "@types/react-dom": "^18.0.10",
    "framer-motion": "^6.5.1",
    "graphql": "^15.5.1",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-icons": "^3.11.0",
    "react-router-dom": "^6.8.0",
    "react-scripts": "5.0.1",
    "react-waypoint": "^10.3.0",
    "typescript": "^4.9.4",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "codegen": "graphql-codegen --config codegen.yml"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@graphql-codegen/add": "^2.0.2",
    "@graphql-codegen/cli": "^1.21.8",
    "@graphql-codegen/typescript": "^1.23.0",
    "@graphql-codegen/typescript-operations": "^1.18.4",
    "@graphql-codegen/typescript-react-apollo": "^2.3.1"
  }
}