Seamlessly bridge Laravel translations to your SPA frontend (React/Vue) with automatic TypeScript generation, type-safe usage, and powerful localization features.
- π Auto-scan translations - Automatically discover translation keys from your codebase
- π Auto-translate - Use Google Translate to automatically translate missing keys
- π¦ TypeScript generation - Export translations as TypeScript files for frontend use
- π― Type-safe - Full IDE support with PHPDoc annotations
- β‘ Performance - In-memory caching and build-time generation
- π Vendor support - Automatically includes translations from vendor packages
- π RTL support - Built-in right-to-left language support
- π¨ Framework agnostic - Works with React, Vue, and vanilla JavaScript
Install via Composer:
composer require devwizardhq/laravel-localizerRun the installation command:
php artisan localizer:installThis interactive installer will:
- β Publish configuration file
- β Create default locale files
- β Publish and register middleware
- β Setup TypeScript output directory
- β Generate initial translation files
If you prefer manual configuration:
# Publish config
php artisan vendor:publish --tag="laravel-localizer-config"
# Publish middleware
php artisan vendor:publish --tag="laravel-localizer-middleware"Register the middleware in bootstrap/app.php:
->withMiddleware(function (Middleware $middleware) {
$middleware->web(append: [
\App\Http\Middleware\LocalizerMiddleware::class,
]);
})Edit config/localizer.php:
return [
'default' => 'en',
'fallback' => 'en',
'available' => [
'en' => ['label' => 'English', 'flag' => 'π¬π§', 'dir' => 'ltr'],
'fr' => ['label' => 'FranΓ§ais', 'flag' => 'π«π·', 'dir' => 'ltr'],
'ar' => ['label' => 'Ψ§ΩΨΉΨ±Ψ¨ΩΨ©', 'flag' => 'πΈπ¦', 'dir' => 'rtl'],
],
'path' => lang_path(),
'typescript_output_path' => resource_path('js/lang'),
];Scan your codebase for translation keys:
php artisan localizer:sync --allThis finds all __(), trans(), and lang() calls and adds missing keys to your language files.
Export translations for your frontend:
php artisan localizer:generate --allGenerates TypeScript files in resources/js/lang/:
// resources/js/lang/en.ts
export const en = {
"welcome": "Welcome",
"validation.required": "This field is required"
} as const;Install the corresponding frontend package:
# For React
npm install @devwizard/laravel-localizer-react
# For Vue
npm install @devwizard/laravel-localizer-vueSee the React package README or Vue package README for frontend integration details.
# Sync all locales
php artisan localizer:sync --all
# Sync specific locales
php artisan localizer:sync --locales=en,fr
# Interactive selection
php artisan localizer:syncAutomatically translate from one locale to another using Google Translate:
# With options
php artisan localizer:translate --source=en --target=fr
# Interactive selection
php artisan localizer:translateNote: Requires stichoza/google-translate-php:
composer require stichoza/google-translate-php# Generate all locales
php artisan localizer:generate --all
# Generate specific locales
php artisan localizer:generate --locales=en,fr
# Interactive selection
php artisan localizer:generateuse DevWizard\Localizer\Facades\Localizer;
// Create a new locale
Localizer::create('fr', fromLocale: 'en');
// Get all translations (JSON + PHP combined)
$translations = Localizer::get('en');
// Get JSON translations only
$jsonTranslations = Localizer::getJson('en');
// Set a JSON translation
Localizer::set('welcome', 'Welcome!', 'en');
// Set nested PHP translation
Localizer::setPhp('validation.required', 'Field is required', 'en');
// Bulk operations
Localizer::bulkSet([
'hello' => 'Hello',
'goodbye' => 'Goodbye',
], 'en');
// Check if translation exists
if (Localizer::has('welcome', 'en')) {
// ...
}
// Get available locales
$locales = Localizer::availableLocales(); // ['en', 'fr', 'ar']
// Delete a locale
Localizer::delete('fr');
// Rename a locale
Localizer::rename('en', 'en-US');The LocalizerMiddleware automatically:
- Detects user's preferred locale
- Sets the application locale
- Shares locale data with Inertia.js
Locale Detection Priority:
- Query parameter:
?locale=fr - Request header:
X-Locale: fr - Session: stored from previous requests
- User model:
$user->getLocale()(if method exists) - Browser:
Accept-Languageheader - Default:
config('localizer.default')
Shared Inertia Props:
{
locale: {
current: 'en',
dir: 'ltr',
available: {
en: { label: 'English', flag: 'π¬π§', dir: 'ltr' },
fr: { label: 'FranΓ§ais', flag: 'π«π·', dir: 'ltr' },
ar: { label: 'Ψ§ΩΨΉΨ±Ψ¨ΩΨ©', flag: 'πΈπ¦', dir: 'rtl' }
}
}
}The package uses dot notation to organize translations:
- JSON keys (no dots):
welcome,hello worldβ stored in{locale}.json - PHP keys (with dots):
validation.required,auth.failedβ stored in{locale}/{file}.php
Example structure:
lang/
βββ en.json # Simple translations
βββ en/
β βββ validation.php # Validation messages
β βββ auth.php # Auth messages
βββ fr.json
βββ fr/
βββ validation.php
βββ auth.php
The installer automatically adds generated TypeScript files to .gitignore. In your deployment process, regenerate them:
# After composer install
php artisan localizer:generate --all
# Then build frontend
npm run build#!/bin/bash
composer install --no-dev --optimize-autoloader
npm ci
# Generate translations before building
php artisan localizer:generate --all
npm run build
php artisan config:cache
php artisan route:cache
php artisan view:cacheBoth packages provide:
- Hooks/composables for translations
- Vite plugin for automatic regeneration
- Full TypeScript support
- Inertia.js integration
- Placeholder replacement
- Pluralization support
The config/localizer.php file provides extensive customization options:
return [
// Default and fallback locales
'default' => env('APP_LOCALE', 'en'),
'fallback' => env('APP_FALLBACK_LOCALE', 'en'),
// Available locales with metadata
'available' => [
'en' => ['label' => 'English', 'flag' => 'π¬π§', 'dir' => 'ltr'],
],
// Paths
'path' => lang_path(),
'typescript_output_path' => resource_path('js/lang'),
// Scanning configuration
'scan' => [
'include' => [app_path(), resource_path(), base_path('routes')],
'exclude' => [base_path('vendor'), base_path('node_modules')],
'extensions' => ['php', 'blade.php', 'js', 'jsx', 'ts', 'tsx', 'vue'],
],
];composer testPlease see CHANGELOG for more information on what has changed recently.
Please see CONTRIBUTING for details.
Please review our security policy on how to report security vulnerabilities.
The MIT License (MIT). Please see License File for more information.