laravel-lang-sync-inertia

Syncs Laravel translation files to Inertia.js frontend props and generated JSON.

Updated Sep 5, 2025
One-click install
npx skills add https://github.com/baubyte/website --skill laravel-lang-sync-inertia-baubyte
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: laravel-lang-sync-inertia
Source: https://github.com/baubyte/website/tree/main/.agents/skills/laravel-lang-sync-inertia
Command: npx skills add https://github.com/baubyte/website --skill laravel-lang-sync-inertia-baubyte

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires erag/laravel-lang-sync-inertia, @erag/lang-sync-inertia, and includes references (resource) components.

What problem does it solve? Laravel apps using Inertia.js with Vue, React, or Svelte have no built-in way to expose backend PHP translation files to the frontend, forcing developers to duplicate strings or hand-roll sharing logic. This Skill guides the correct setup and usage of erag/laravel-lang-sync-inertia so translations flow from lang/{locale} PHP files into the shared Inertia lang prop or generated JSON files. ## Core Features & Use Cases - Runtime translation loading: Call syncLangFiles() in controllers before Inertia::render() to share one or many translation groups, including nested groups via dot notation like admin.users. - Build-time JSON generation: Run php artisan erag:generate-lang to export PHP translation groups to JSON files that the package auto-loads and merges per locale. - Frontend helpers for Vue, React, and Svelte: Import lang() from the framework-specific entrypoint to use __(), trans(), transChoice(), and trans_choice() directly in components. - Use Case: A Laravel 13 + Inertia + Svelte 5 portfolio site needs bilingual pages; use this Skill to publish the config, generate frontend JSON with erag:generate-lang, and render translations in Svelte components without touching Vite or app.ts. ## Quick Start Ask the AI to set up erag/laravel-lang-sync-inertia in your Laravel Inertia app so your Svelte pages can render translations from the shared lang prop.

Frequently Asked Questions about laravel-lang-sync-inertia

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

FAQPage Schema
How do I share Laravel translations with Inertia.js frontend pages?▼

Call syncLangFiles() with one or more translation group names inside the controller action before returning Inertia::render(). The package shares the loaded groups under the lang Inertia prop, which frontend helpers read for lookups like __('auth.greeting').

How to generate JSON translation files from Laravel PHP lang files?▼

Run php artisan erag:generate-lang after publishing the config with erag:install-lang. It reads locale directories under the configured lang_path and writes JSON files to output_lang/{locale}/{group}.json, which the package auto-loads and merges on each request.

Does erag/laravel-lang-sync-inertia support Svelte, Vue, and React?▼

Yes, the companion npm package provides dedicated entrypoints: @erag/lang-sync-inertia/vue, /react, and /svelte. The Svelte entrypoint requires @inertiajs/svelte v3 with Svelte 5, and helpers work inside $derived expressions.

Why are my translations missing in the Inertia frontend?▼

Common causes are calling syncLangFiles() after returning the Inertia response, missing lang/{locale} files because php artisan lang:publish was never run, or importing from the root frontend package instead of the /vue, /react, or /svelte entrypoint.

Do I need to configure the translation helper in Vite or app.ts?▼

No. The package explicitly requires no Vite, app.ts, or app.js configuration and no Inertia plugin registration. Import lang() directly inside each page or component that needs translations.

What happens when generated JSON and syncLangFiles() define the same key?▼

The service provider merges them with array_replace_recursive($jsonLang, $runtimeLang), so generated JSON is the base dataset and runtime-loaded translations from syncLangFiles() override conflicting keys.