Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

[Router/FS] Trailing slash in routePathFromFile breaks TypeScript inference for nested paths in `paths` proxy

Geschlossen Anfängerfreundlich
  • Stimmt etwas nicht?
#652 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Maintainer antworten meist innerhalb von 1 Tag

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Anfängerfreundlichkeit
85/100
Issue-Typ
Bug
Klarheit
Klar beschrieben
Aktivitätsstatus
Aktiv
Tech-Stack
typescript
Bereich
web-dev

Rechercherichtung

Beginne in filesystem-routing/dist/convention.js bei routePathFromFile und reproduziere den generierten Pfad anhand der Routenstruktur posts/[id]/index.tsx. Überprüfe die generierte Deklaration und die TypeScript-Inferenz von paths.posts(id).edit(). Erledigt ist die Aufgabe, wenn Index-Routen /posts/:id ohne abschließenden Schrägstrich ausgeben und der Aufruf der verschachtelten paths erfolgreich kompiliert.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

Describe the bug

When using file-system routing with index.tsx inside dynamic route folders, filesystem-routing produces paths with an unintended trailing slash (e.g. /posts/:id/ instead of /posts/:id).

This trailing slash causes @solidjs/router's type generator (SegmentsOf) to split the path into ["posts", ":id", ""] with a phantom empty segment "" at the end. As a result:

  • When calling a nested subpath on the paths proxy: paths.posts(id).edit(), TypeScript selects the first matching overload signature (which terminated at PathEnd due to the empty segment) and throws: 
    error TS2339: Property 'edit' does not exist on type 'PathEnd<DefaultSearchTypes, { id: string; }>'.
  • Meanwhile, at runtime, createPathsProxy works completely fine and outputs "/posts/1/edit".
Your Example Website or App

Blank

Steps to Reproduce the Bug or Issue

Step 1: In a project using @solidjs/router/fs and filesystem-routing, create the following route structure:

src/routes/
  └── posts/
      ├── [id]/
      │   ├── index.tsx  # Post detail
      │   └── edit.tsx   # Post edit
      └── index.tsx      # Posts list

Step 2: Generate the route types using fileRoutes({ types: true }).
Notice in the generated declaration, the route path is emitted with a trailing slash:

path: "/posts/:id/"

Step 3: Attempt to use the typed paths proxy in any component:

import { paths } from "~/router";

// ❌ TypeScript Error: Property 'edit' does not exist on type 'PathEnd<...>'
paths.posts(1).edit();

Minimal TypeScript reproduction (no file system needed):

import { createRouter, defineRoutes } from "@solidjs/router";

const Router = createRouter({
  routes: defineRoutes([
    { path: "/posts/:id/" },    // generated from [id]/index.tsx
    { path: "/posts/:id/edit" } // generated from [id]/edit.tsx
  ])
});

// ❌ TypeScript Error: Property 'edit' does not exist on type 'PathEnd<...>'
Router.paths.posts(1).edit();

// ✅ If the trailing slash is removed, it compiles cleanly:
const FixedRouter = createRouter({
  routes: defineRoutes([
    { path: "/posts/:id" },
    { path: "/posts/:id/edit" }
  ])
});
FixedRouter.paths.posts(1).edit(); // OK!
Expected behavior
  1. filesystem-routing should emit /posts/:id (without trailing slash) for posts/[id]/index.tsx.
  2. paths.posts(id).edit() should be accepted by TypeScript and infer the full path "/posts/1/edit" without type errors.
Screenshots or Videos

No response

Platform
  • OS: Windows 10
  • Node: 24
  • SolidJS: 2.0.0-rc.6
  • @solidjs/router: 2.0.0-next.34 (latest)
  • filesystem-routing: 0.4.0 (latest)
  • TypeScript: 5.9.2
Additional context

The bug originates in filesystem-routing/dist/convention.js:

export function routePathFromFile(routeFile) {
    const routePath = routeFile
        .slice(1)
        .replace(/(^|\/)index$/, "$1") // ⚠️ BUG: Replaces "/index" with "$1" ("/") instead of stripping the slash
        .replace(/\[([^/]+)\]/g, ...);
    return routePath?.length > 0 ? `/${routePath}` : "/";
}

Replacing /(^|\/)index$/ with $1 preserves the preceding slash, turning posts/[id]/index into posts/[id]/.

Proposed fix:

- .replace(/(^|\/)index$/, "$1")
+ .replace(/\/index$/, "")

Or normalize trailing slashes on all non-root routes:

return routePath?.length > 0 ? `/${routePath.replace(/\/+$/, "")}` : "/";
Vorherrschende Sprache
TypeScript
Sterne
1.3k
Forks
183
Ø Merge
14 Std. 35 Min.
Gemergte PRs (30 T.)
52

Entwicklungsumgebung

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus solidjs/solid-router

Alle Issues in solidjs/solid-router

Ähnliche Issues

Weitere Issues zu TypeScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.