Next.js Discord

Discord Forum

<Link> not working

Unanswered
Ratonero Valenciano posted this in #help-forum
Open in Discord
Avatar
Ratonero ValencianoOP
  <div className="hidden md:flex space-x-8 font-sans">
        <Link href="#nav"><h2 className="text-lg hover:cursor-pointer">Home</h2></Link>
        <Link href="#fleetSection"><h2 className="text-lg hover:cursor-pointer">Cars</h2></Link>
        <Link href="#Contact"><h2 className="text-lg hover:cursor-pointer">Contact Us</h2></Link>
       <Link href="#reviews"> <h2 className="text-lg hover:cursor-pointer">Testimonials</h2></Link>
       <Link href="#Contact"><button className="py-3 px-4 uppercase bg-blue-800 text-white font-semibold relative bottom-3 text-md hover:bg-black hover:text-white transition-all duration-300">rent a sports car today!</button></Link>
      </div>

why has <Link> stopped working?

20 Replies

Avatar
Clown
What exactly isnt working?
Do you Sections with the correct id?
Avatar
Ratonero ValencianoOP
Yes
On localhost:3000 it works fine
But when I host it on netlify
It doesn’t work
When you click any of those Nav links
It does nothing
Avatar
Clown
Update to the latest next version (npm update) and test it out on npm run build && npm start
On netlify you should also try and see if the IDs are being changed for some reason or the links are being messed with using the browser dev tools
Avatar
Ratonero ValencianoOP
I’m using NextJS 13
Avatar
Clown
If nothing works change to a normal <a>
Avatar
Ratonero ValencianoOP
I disabled ESLint
Avatar
Clown
NextJS 13 also has minor and patch versions
Try this tbh
Maybe Link requires you to pass in the full path starting from root. Who knows. A simple <a> tag should fix your problem and Link isnt very useful in this case anyways imo
Avatar
Ratonero ValencianoOP
I replaced it with <a/>
Ty
Avatar
Clown
It works correctly?
Avatar
Ratonero ValencianoOP
Yes