Standardmäßig ist der Prompt ausgewählt, der zuerst die Quelle prüft. Sie können zu einem direkten Befehl wechseln oder eine lokale Kopie herunterladen.
Quelldateien prüfen
Lesen Sie SKILL.md und alle von SkillsMP angezeigten Begleitdateien, bevor Sie sich für eine Installation entscheiden.
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Ein direkter Befehl überspringt den Prüf-Prompt. Prüfen Sie die Quelle, bevor Sie ihn ausführen.
TanStack Router treats search params as JSON-first application state. They are automatically parsed from the URL into structured objects (numbers, booleans, arrays, nested objects) and validated via validateSearch on each route.
CRITICAL: When using zodValidator() and Zod v3, use fallback() from @tanstack/zod-adapter, NOT zod's .catch(). Using .catch() with the zod adapter makes the output type unknown, destroying type safety. This does not apply to Valibot or ArkType (which use their own fallback mechanisms). It also does not apply to Zod v4, which should use .catch() and not use the zodValidator().
CRITICAL: Types are fully inferred. Never annotate the return of useSearch().
exportconstRoute = createFileRoute("/products")({
validateSearch: productSearchSchema,
// Pick ONLY the params the loader needs — not the entire search objectloaderDeps: ({ search }) => ({ page: search.page }),
loader: async ({ deps }) => {
returnfetchProducts({ page: deps.page })
},
})
Common Mistakes
1. HIGH: Using zod v3's .catch() with zodValidator() instead of adapter fallback()
// WRONG — .catch() with zodValidator makes the type unknownconst schema = z.object({ page: z.number().catch(1) })
validateSearch: zodValidator(schema) // page is typed as unknown!// CORRECT — fallback() preserves the inferred typeimport { fallback } from"@tanstack/zod-adapter"const schema = z.object({ page: fallback(z.number(), 1) })
Important: This only applies when using Zod v3, not when using Zod v4. For v4, using .catch() is correct.
2. HIGH: Returning entire search object from loaderDeps
// WRONG — loader re-runs on ANY search param changeloaderDeps: ({ search }) => search
// CORRECT — loader only re-runs when page changesloaderDeps: ({ search }) => ({ page: search.page })
3. HIGH: Passing Date objects in search params
// WRONG — Date does not serialize correctly to JSON in URLs
<Link search={{ startDate: newDate() }}>
// CORRECT — convert to ISO string<Linksearch={{startDate:newDate().toISOString() }}>