CODEWITHSUNDEEP
javascriptreactjs
Oussama Chaouche
Oussama Chaouche

Reputation: 33

export 'useNavigation' (imported as 'useNavigation') was not found in 'react-router-dom'

I am trying to import useNavigation from 'react-router-dom'

import { useNavigation } from 'react-router-dom'

however, I get this error:

export 'useNavigation' (imported as 'useNavigation') was not found in 'react-router-dom' (possible exports: BrowserRouter, HashRouter, Link, MemoryRouter, NavLink, Navigate, Outlet, Route, Router, Routes, UNSAFE_LocationContext, UNSAFE_NavigationContext, UNSAFE_RouteContext, createRoutesFromChildren, createSearchParams, generatePath, matchPath, matchRoutes, renderMatches, resolvePath, unstable_HistoryRouter, useHref, useInRouterContext, useLinkClickHandler, useLocation, useMatch, useNavigate, useNavigationType, useOutlet, useOutletContext, useParams, useResolvedPath, useRoutes, useSearchParams)

this is depenencies of package.json

"dependencies": {
    "@testing-library/jest-dom": "^5.16.1",
    "@testing-library/react": "^12.1.2",
    "@testing-library/user-event": "^13.5.0",
    "bcrypt": "^5.0.1",
    "bootstrap": "^5.1.3",
    "buffer": "^6.0.3",
    "crypto-js": "^4.1.1",
    "jsonwebtoken": "^8.5.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router-dom": "^6.2.1",
    "react-scripts": "5.0.0",
    "web-vitals": "^2.1.3"
  }

Upvotes: 1

Views: 3298

Answers (1)

Yeasin49
Yeasin49

Reputation: 54

You spelled the hook wrong!

The correct hook is useNavigate
Though Steve K already replied.
But for further details check this link : https://reactrouter.com/docs/en/v6/api#usenavigate
Those who are looking for similar error Please Check :
1) You spelled right
2) you imported the hook from the right package. For this case it is "react-router-dom"
2) Your import path is ok.

Upvotes: 2

Related Questions