T
TanStack•3mo ago
fascinating-indigo

Autocomplete and url typing not working

Hey guys, I installed Tanstack router and made several routes. It works well, except that when I use <Link> or useNavigate(), I don't have url autocomplete and type validation. I'm using react-vite, and the plugin is enabled in first in my vite.config.ts file. Any idea what's going on ?
6 Replies
other-emerald
other-emerald•3mo ago
did you register the router types via the module declaration?
fascinating-indigo
fascinating-indigoOP•3mo ago
Hmm I don't think so Like this: 
declare module '@tanstack/react-router' {
  interface Register {
    router: typeof router
  }
}
declare module '@tanstack/react-router' {
  interface Register {
    router: typeof router
  }
}
other-emerald
other-emerald•3mo ago
yes that's required as shown in the docs
fascinating-indigo
fascinating-indigoOP•3mo ago
Nice it works 😄 i didn't checked this page before ! And is there a Type i can use for url ? Like I want to pass an url to a page to a component prop, what Type should I give to my prop ?
other-emerald
other-emerald•3mo ago
https://tanstack.com/router/latest/docs/framework/react/guide/type-utilities#type-checking-link-options-with-validatelinkoptions
Type Utilities | TanStack Router React Docs
Most types exposed by TanStack Router are internal, subject to breaking changes and not always easy to use. That is why TanStack Router has a subset of exposed types focused on ease of use with the in...
other-emerald
other-emerald•3mo ago
https://tanstack.com/router/latest/docs/framework/react/guide/custom-link#createlink-for-cross-cutting-concerns
Custom Link | TanStack Router React Docs
While repeating yourself can be acceptable in many situations, you might find that you do it too often. At times, you may want to create cross-cutting components with additional behavior or styles. Yo...

Did you find this page helpful?