TanStack / TanStack/router

Trailing slash when SSR, otherwise ignored

Open
#3,281 3 comments 7 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
15.1k
Forks
1.9k
Avg merge
1d 20h
Merged PRs (30d)
143

Description

Which project does this relate to?

Router

Describe the bug

I have a route config that looks like this:

routes/
├── app/
│   ├── games/
│   │   └── $gameId/
│   │       └── index.tsx
│   ├── index.tsx
│   └── route.tsx
├── __root.tsx
├── _auth.signup.tsx
├── _auth.signin.tsx
├── _auth.tsx
└── index.tsx

And the generated route tree looks like this:

/
/app
/app/games/$gameId
/signup
/signin

The issue I'm experiencing is with /app. If I soft-navigate from /signin there is no trailing slash, but if I hit refresh in the browser the URL turns into /app/. I'm guessing it's because of the index.tsx inside of the app folder, but I have set the trailingSlashes option to 'never' in the createRouter function. Is this expected?

GitHub repo: https://github.com/nikolovlazar/trivius/tree/48939a1989a36ff2728ce2f4f45f6c64c5efd43a

Your Example Website or App

https://stackblitz.com/edit/github-vajjdgwa?file=app%2Froutes%2Fapp%2Findex.tsx

Steps to Reproduce the Bug or Issue
  1. Click on the link in the / page that takes you to /app
  2. Note the URL: ends with /app - no trailing slash
  3. Hit refresh and note the URL: ends with /app/ with a trailing slash
Expected behavior

Hard-navigating to the /app page should not add a trailing slash at the end.

Screenshots or Videos

No response

Platform
  • OS: macOS
  • Browser: Brave
  • Version: 1.74.51
Additional context

No response

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start with the route config shown in the issue and the createRouter trailingSlashes option, then reproduce the behavior in the linked StackBlitz example or the provided trivius repository. Compare soft navigation from /signin with a browser refresh at /app; done means both paths preserve /app without adding a trailing slash.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
backend, frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.