Download the PHP package erag/laravel-lang-sync-inertia without Composer

🌐 Laravel Easy Translation Sync with Inertia (Vue.js / React)

Laravel Lang Sync Inertia helps you add different languages to your Laravel app with Vue or React. It makes translations easy!

✨ Features

• ⚙️ Inertia.js integration with automatic sharing
• 📂 Load single or multiple language files
• 🔄 Dynamic replacement support in translations
• 🧩 Supports both Vue.js and React
• 🧵 Built-in middleware for automatic sharing
• 🛠️ Helper functions like trans() and __() for frontend usage
• 🌍 Automatically switches language folder based on current Laravel locale

📦 Installation

To install the package, run the following command via Composer:

🛠️ Publish Configuration & Composables

To publish the configuration and composables, run:

This will publish:

• ✅ config/inertia-lang.php — for customizing the language path
• ✅ resources/js/composables/useLang.ts — for Vue (if selected)
• ✅ resources/js/hooks/useLang.tsx — for React (if selected)

During installation, you'll be prompted to choose either Vue or React for your frontend framework.

🚀 Usage Guide: syncLangFiles()

The syncLangFiles() function is a Laravel helper provided by this package. Use it inside your controller methods to load translation files and automatically share them with your Vue or React frontend via Inertia.js.

✅ Think of syncLangFiles() as a bridge between Laravel’s backend translations and your Inertia-powered frontend.

🧠 How to Use

✅ Supported Inputs

The syncLangFiles() function supports:

• A string: For a single translation file → syncLangFiles('auth')

• An array of strings: For multiple translation files → syncLangFiles(['auth', 'validation'])

🧪 How It Works

Suppose you have the following language file:

📁 resources/lang/en/auth.php

Now, you want to show auth.welcome and auth.greeting on the frontend using Vue or React.

🔁 Step-by-Step Example

🔹 1. Load Translations in Controller

🧠 This loads the file resources/lang/en/auth.php based on the current Laravel locale and shares its content with Inertia.

💡 Frontend Usage

✅ Vue Example

✅ React Example

📤 Output on Page

When the above code is rendered, this will be the output:

🧠 Notes on trans() vs __()

✅ You can use them interchangeably for basic translations. ✅ Both support placeholder replacement.

🛠 Example with Plain String

Sometimes, you might want to append something without a key:

But recommended usage is always with an object:

📡 Access Inertia Shared Props

Vue:

React:

You can directly access the full language object shared by Inertia.

🗂️ Translation File Location

Language files are loaded based on the current Laravel locale. By default, Laravel uses resources/lang/{locale} structure:

When calling:

It dynamically loads resources/lang/{locale}/auth.php.

⚙️ Configuration

You can customize the language directory by modifying config/inertia-lang.php:

🧩 Composables Location

• Vue: resources/js/composables/useLang.ts
• React: resources/js/hooks/useLang.tsx

You can modify the location or structure of these files by adjusting the published files.

📄 License

This package is licensed under the MIT License.

🤝 Contributing

Pull requests and issues are welcome! Let’s work together to improve localization in Laravel! 💬