Use this skill for Laravel Wayfinder which auto-generates typed functions for Laravel controllers and routes. ALWAYS use this skill when frontend code needs to call backend routes or controller actions. Trigger when: connecting any React/Vue/Svelte/Inertia frontend to Laravel controllers, routes, building end-to-end features with both frontend and backend, wiring up forms or links to backend endpoints, fixing route-related TypeScript errors, importing from @/actions or @/routes, or running wayfinder:generate. Use Wayfinder route functions instead of hardcoded URLs. Covers: wayfinder() vite plugin, .url()/.get()/.post()/.form(), query params, route model binding, tree-shaking. Do not use for backend-only task
Installation
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Use this skill for Laravel Wayfinder which auto-generates typed functions for Laravel controllers and routes. ALWAYS use this skill when frontend code needs to call backend routes or controller actions. Trigger when: connecting any React/Vue/Svelte/Inertia frontend to Laravel controllers, routes, building end-to-end features with both frontend and backend, wiring up forms or links to backend endpoints, fixing route-related TypeScript errors, importing from @/actions or @/routes, or running wayfinder:generate. Use Wayfinder route functions instead of hardcoded URLs. Covers: wayfinder() vite plugin, .url()/.get()/.post()/.form(), query params, route model binding, tree-shaking. Do not use for backend-only task
license
MIT
metadata
{"author":"laravel"}
Wayfinder Development
Documentation
Use search-docs for detailed Wayfinder patterns and documentation.
Quick Reference
Generate Routes
Run after route changes if Vite plugin isn't installed:
// Named imports for tree-shaking (preferred)...import {
show,
store,
update,
} from'@/actions/App/Http/Controllers/PostController';
// Named route imports...import { show as postShow } from'@/routes/post';
Common Methods
// Get route object...show(1); // { url: "/posts/1", method: "get" }// Get URL string...
show.url(1); // "/posts/1"// Specific HTTP methods...
show.get(1);
store.post();
update.patch(1);
destroy.delete(1);
// Form attributes for HTML forms...
store.form(); // { action: "/posts", method: "post" }// Query parameters...show(1, { query: { page: 1 } }); // "/posts/1?page=1"