wayfinder-development

Generate type-safe Laravel route objects and URL builders for Vue components.

Updated Feb 3, 2026
One-click install
npx skills add https://github.com/krlmrr/laravel-playground --skill wayfinder-development
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: wayfinder-development
Source: https://github.com/krlmrr/laravel-playground/tree/main/.claude/skills/wayfinder-development
Command: npx skills add https://github.com/krlmrr/laravel-playground --skill wayfinder-development

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Activates whenever referencing backend routes in frontend components. Importing from @/actions or @/routes, calling Laravel routes from TypeScript, or creating links to backend endpoints.

Core Features & Use Cases

  • Generate route objects and helpers to streamline frontend usage with Laravel routes
  • Provide type-safe imports from @/actions and @/routes for reliable navigation
  • Integrate with Wayfinder and Inertia form patterns to support form routing and navigation

Quick Start

Run the Wayfinder route generation after backend changes to regenerate the route mappings.

Frequently Asked Questions about wayfinder-development

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate type-safe Laravel routes for TypeScript frontend components?

Type-safe Laravel route generation maps backend endpoints to frontend usage by creating route objects and URL builders. You run the Wayfinder route generation tool after backend changes to regenerate route mappings for reliable TypeScript imports.

Can I use Wayfinder with Vue and Inertia form patterns for frontend routing?

Wayfinder integrates with Vue components and Inertia form patterns to support form routing and navigation. It aligns form helpers and route objects with backend changes, ensuring type-safe imports from @/actions and @/routes.

Why do my frontend imports from @/actions break after updating Laravel backend routes?

Frontend imports from @/actions break when route mappings become stale after backend updates. You must regenerate the route mappings using the Wayfinder tool to ensure TypeScript route objects and URL builders align with the latest backend changes.

What is the best way to call Laravel routes from TypeScript without losing type safety?

The best way to call Laravel routes from TypeScript is using generated route objects and helpers. Wayfinder provides type-safe imports from @/routes and @/actions, ensuring frontend navigation and URL builders align with backend endpoints.

Does Wayfinder route generation support JavaScript or only TypeScript for frontend route imports?

Wayfinder route generation supports calling Laravel routes from both TypeScript and JavaScript in Vue components. It generates route objects and form helpers that provide type safety for TypeScript while remaining compatible with JavaScript.

When should I regenerate route mappings when using type-safe Laravel route generation?

You should regenerate route mappings immediately after making backend changes. Running the Wayfinder route generation ensures that frontend route objects, URL builders, and form helpers stay aligned with the updated Laravel backend routes.