routeId should be based on route path instead of file name.

[adnanalbeda]

I'm trying React-Router Framework, and I tried to add my first route:

import { type RouteConfig, index, route } from "@react-router/dev/routes";

export default [
  index("./routes/home.tsx"),
  route("home", "./routes/home.tsx"), // Duplicate file
] satisfies RouteConfig;

Then I ran pnpm dev and got hit by error:

Error: Route config in "routes.ts" is invalid.

Error: Unable to define routes with duplicate route id: "routes/home"

So I discovered that route Ids are file based, instead of path based.
Technically, no one would use same file in more than one route, but it should be possible.
What's more unlikely is overriding route path or duplicating them.

So I tried this code:

import { type RouteConfig, index, route } from "@react-router/dev/routes";

export default [
  index("./routes/home.tsx"),
  route("home", "./routes/home2.tsx"),
  route("home", "./routes/home3.tsx"), // Duplicate route
] satisfies RouteConfig;

It had no issues running it, picked the first /home route home2, and doesn't override it.

So I guess it makes more sense to pick routeId from the route path instead of file based to avoid duplicating route path.

[sergiodxa]

Let's say you have:

layout(layoutFile, [
  route("home", homeFile, [
    index(indexFile)
  ])
])

All of that becomes /home

What's the route id of each layout route, the home route and the index route?

The file is more unique than the path as many routes can become the same path, and some routes may not even have a path (layouts and index)

[ariesclark]

You can specify an explicit ID.

import { type RouteConfig, index, route } from "@react-router/dev/routes";

export default [
  index("./routes/home.tsx"),
  route("home", "./routes/home.tsx", { id: "/home" })
] satisfies RouteConfig;

[adnanalbeda]

I found this a good solution when I explicitly needs to use the same file twice.

I tried file based flatRoutes and it handle this nicely.
I have multiple flatRoutes calls for different directories and they don't complain about filename or ids.

So I'm either using it or explicitly defining the id, as you suggested, where I have defined custom routes and there are duplicates. Like not found page, I use the same file, but one inside a layout and another one without it.