Skip to content

[7.9.6] UseRoute has a hidden type error #14572

@AviVahl

Description

@AviVahl

Reproduction

It is hidden by --skipLibCheck.

To see it:

npm init [email protected] my-react-router-app -- --yes
cd my-react-router-app
npm run typecheck
npx tsc --noEmit --skipLibCheck false

It happens due to RouteModules being augmented by .react-router/types/+routes.ts with an exact shape (non record type):

declare module "react-router" {
  interface Register {
    pages: Pages
    routeFiles: RouteFiles
    routeModules: RouteModules
  }
}

<...>

type RouteModules = {
  "root": typeof import("./app/root.tsx");
  "routes/home": typeof import("./app/routes/home.tsx");
};

Can be fixed by changing this line:
? RouteModules[RouteId]["handle"]
to:
? (RouteModules[RouteId] extends {"handle": unknown} ? RouteModules[RouteId]["handle"] : unknown)

System Info

Irrelevant. Not system/browser specific. Happens with latest versions

Used Package Manager

npm

Expected Behavior

No type errors coming from react-router's .d.ts files.

Actual Behavior

node_modules/react-router/dist/development/index.d.mts:870:52 - error TS2536: Type '"handle"' cannot be used to index type 'RouteModules[RouteId]'.

870     handle: RouteId extends keyof RouteModules$1 ? RouteModules$1[RouteId]["handle"] : unknown;
                                                       ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


Found 1 error in node_modules/react-router/dist/development/index.d.mts:870

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions