ImportError: 'useNavigate' is not exported from 'react-router-dom'

Question

When trying to import useNavigate from react-router-dom, I get the following error:

Attempted import error: 'useNavigate' is not exported from 'react-router-dom'.

My Import statement:

import { useNavigate } from 'react-router-dom';

Answer 1

You are trying to use the latest features of react-router.
Please make sure that you installed the [email protected] .

It is React Router v6 which gives you a useNavigate hook

Please refer here for further reading from the React Router team

Two quick ways to check the version:

• Verify from the package.json file
• Run npm list --depth=0 to view the various packages in your project