react-router-dom usenavigate is not a function
# generalg
Greg Martin
12/30/2021, 8:20 PMreact-router-dom usenavigate is not a function
d
Devin
12/30/2021, 8:26 PMI don’t know what context you’re encountering this but there are three things I’d look at to start with.
1 - what is in your package.json for your react app
2 - what does your import look like
3 - is your useNavigate being called within a
<Router /><Routes />g
Greg Martin
12/30/2021, 8:28 PMI am going through all of the steps for the Notes app. When I did what was instructed on the page about adding react-router-bootstrap, everything stopped working.
Greg Martin
12/30/2021, 8:29 PMAs far as I know, I am not calling useNavigate at all
d
Devin
12/30/2021, 8:33 PMWhat is in your package.json
g
Greg Martin
12/30/2021, 8:34 PM Copy code
{
"name": "frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.1",
"@testing-library/react": "^12.1.2",
"@testing-library/user-event": "^13.5.0",
"react": "^17.0.2",
"react-bootstrap": "^1.6.1",
"react-dom": "^17.0.2",
"react-icons": "^4.2.0",
"react-router-bootstrap": "^0.26.0",
"react-router-dom": "5.2",
"react-scripts": "5.0.0",
"web-vitals": "^2.1.2"
},
"scripts": {
"start": "sst-env -- react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"@serverless-stack/static-site-env": "^0.55.1"
}
}d
Devin
12/30/2021, 8:40 PMHmm that’s peculiar. So if you go back a step, and remove it, everything works again?
g
Greg Martin
12/30/2021, 8:40 PMyes
d
Devin
12/30/2021, 8:41 PMso just the very act of installing it causes that?
Devin
12/30/2021, 8:41 PMTry installing 0.25 instead. That’s what I have in my notes project and it works just fine.
g
Greg Martin
12/30/2021, 8:42 PMon this page
Copy code
<https://serverless-stack.com/chapters/adding-links-in-the-navbar.html> Copy code
Unfortunately, when you click on them they refreshGreg Martin
12/30/2021, 8:42 PMBut if I do the steps after that phrase, it doesn't work at all and I get the error I started this thread with.
d
Devin
12/30/2021, 8:44 PMIMO - step one. install exactly .0.25 of react router bootstrap
Devin
12/30/2021, 8:44 PMthen blow out your node_modules and reinstall
Devin
12/30/2021, 8:46 PMalso, another thing is that if you can push your repo up to github so I can look I can maybe help
g
Greg Martin
12/30/2021, 8:47 PMThat fixed it
Greg Martin
12/30/2021, 8:48 PMThank you very much
Greg Martin
12/30/2021, 8:48 PMpossibly package.json line that says ^0.25.0 should just say 0.25.0
d
Devin
12/30/2021, 8:48 PMSure no prob! What happened is that react-router 6 came out. So that is why I thought that may be the issue
Devin
12/30/2021, 8:49 PMYeah I’m sure the gang would accept a PR for that.
Devin
12/30/2021, 8:50 PMFWWI, I hang out in the #help channel a lot and its a good community. You’ll likely get solid responses there
g
Greg Martin
12/30/2021, 8:50 PMThanks again
Greg Martin
12/30/2021, 8:51 PMI shouldn't have frustratedly jacked with with it for 2 hours before I hit the Slack channel.
d
Devin
12/30/2021, 8:51 PMStory of my life hahahaha
Devin
12/30/2021, 9:01 PMI made a PR for that change Greg. At least the next person won’t run into it
a
Adrián Mouly
12/31/2021, 3:10 AMThanks for let me know that is not a function.
Adrián Mouly
12/31/2021, 3:10 AM😂
g
Greg Martin
12/31/2021, 3:11 AMYou guys are great. I am a novice with sst, but man is it impressive.
a
Adrián Mouly
12/31/2021, 3:11 AMYes it is.
j
Jay
12/31/2021, 6:43 PM
Thanks for the PR @Devin. Just merged it.
2 Views