Hire Laravel developers with AI expertise at $20/hr. Get started in 48 hours.

Laravel Localization To Vue

kg-bot/laravel-localization-to-vue image

Laravel Localization To Vue stats

Downloads
432.4K
Stars
238
Open Issues
1
Forks
35

View on GitHub →

Laravel package used to collect all localization files from resources/lang (and custom) directories and sub-directories and make them available as JSON file

Laravel Localization To Vue/JSON

This package collects all localizations from resources/lang directory and it's sub-directories and converts them to plain array
which can later be converted to JSON object and used with libraries like Vue, Angular, etc.

Installing

Laravel before version 9

composer require kg-bot/laravel-localization-to-vue:^1

Laravel 9

composer require kg-bot/laravel-localization-to-vue:^2

Laravel 8+

Laravel 8 requires minimum of PHP 7.3. make sure you have at least PHP 7.3 before running composer.

Laravel 9+

Laravel 9 requires minimum of PHP 8.0.2 make sure you have at least PHP 8.0.2 before running composer.

Laravel 5.5+

Laravel 5.5 uses Package Auto-Discovery, so doesn't require you to manually add the ServiceProvider.

If you don't use auto-discovery, add the ServiceProvider to the providers array in config/app.php

KgBot\LaravelLocalization\LaravelLocalizationServiceProvider::class

and if you want alias add this inside aliases array in config/app.php

"ExportLocalization" => "KgBot\\LaravelLocalization\\Facades\\ExportLocalizations"

Settings and configuration

You can export config by running

php artisan vendor:publish --provider="KgBot\LaravelLocalization\LaravelLocalizationServiceProvider" --tag=config

if you want to parse multiple language directories or some other directory except lang_path() you can add multiple paths in config paths.lang_dirs inside array.

It can be just one path or multiple paths, for example

paths => [lang_path(), app_path('lang'), app_path('Modules/Blog/lang')]

You can run your own callback function after export, to do that you must register globally accessible function, for example register function.php inside composer files autoload, and add your function inside config/laravel-localization.php, key export_callback. Example:

// helpers/functions.php
 
if (! function_exists('testExport')) {
/**
* Change all instances of :argument to {argument}
*
* @param $string
* @return void
*
*/
function testExport($string) {
array_walk_recursive($string, function (&$v, $k) { $v = preg_replace('/:(\w+)/', '{$1}', $v); });
 
return $string;
}
}
 
 
// composer.json
....
"autoload": {
"files": [
"helpers/functions.php"
],
"psr-4": {
"App\\": "app/"
},
"classmap": [
"database/seeds",
"database/factories"
]
},
....
 
// config/laravel-localization.php
...
'export_callback' => 'testExport',
...

Usage

This package can be used in multiple ways, I'll give examples for some of them, but there's really no limitation.

First example would be to add view composed variable and use it in blade views.

// inside ServiceProvider
 
// With alias
use ExportLocalization;
 
// Without alias
use KgBot\LaravelLocalization\Facades\ExportLocalizations as ExportLocalization;
 
 
View::composer( 'view.file', function ( $view ) {
 
return $view->with( [
'messages' => ExportLocalization::export()->toArray(),
] );
} );

Second way would be to request it over HTTP just like any other file

<script>
let messages = axios.get('http://localhost/js/localization.js') // This is default route which can be changed in config
</script>

For this to work, you need to enable the route via LARAVEL_LOCALIZATION_ROUTE_ENABLE in your .env file or in config/laravel-localization.php

You can also export messages to ECMAScript 6 standard JavaScript module with artisan command php artisan export:messages

Export for npm localization packages like Lang.js

If you need special format of array that's recognised by some npm localization packages as Lang.js.

// Call toFlat() instead of toArray()
ExportLocalization::export()->toFlat()
 
or
 
// For CLI usage
php artisan export:messages-flat

Some examples why would you use this package and messages over Laravel standard localization

// Inside blade view
<script>
window.default_locale = "{{ config('app.locale') }}";
window.fallback_locale = "{{ config('app.fallback_locale') }}";
window.messages = @json($messages);
</script>
// And optionaly you can then use it in any JavaScript file or Vue.js component
 
// app.js
import Vue from 'vue';
import Lang from 'lang.js';
 
const default_locale = window.default_language;
const fallback_locale = window.fallback_locale;
const messages = window.messages;
 
Vue.prototype.trans = new Lang( { messages, locale: default_locale, fallback: fallback_locale } );
// Example.vue
<b-input v-model="query"
type="text"
:placeholder="trans.get('search.placeholder')"
></b-input>

A note about json files

Laravel 5.4+ allows localization to be strutured using a single .json file for each language, in order to use the strings inside the provided json file you must prepend the __JSON__ key

// Assuming that es.json exists and it is the default locale in your app
{
"I love programming": "Me encanta programar"
}
// Example.vue
<b-input v-model="query" type="text" :placeholder="trans.get('__JSON__.I love programming')"></b-input>

Routing

This package exposes one route http://localhost/js/localization.js by default but you can change the prefix to anything you whish in config file.

You can also have a nice route name for blade templates or any other route calls, it's route('assets.lang') by default but it's customizable by config/environment file.

Proposals, comments, feedback

Everything of this is highly welcome and appreciated

To-Do

  • Create exclude configuration so not files/directories are collected

Anything else you can think of please leave me comments, mail me, create issue, whatever you prefer.

License

This project is licensed under the MIT License - see the LICENSE.md file for details


Kg Bot Laravel Localization To Vue Related Articles

Convert HTML Strings to Translation Functions image

Convert HTML Strings to Translation Functions

Read article
Use Inertia.js like a boss image

Use Inertia.js like a boss

Read article
Laravel and Vue Translation Package image

Laravel and Vue Translation Package

Read article
Laraform – Full-Stack Form Builder for Vue.js & Laravel (sponsor) image

Laraform – Full-Stack Form Builder for Vue.js & Laravel (sponsor)

Read article
Laravel Localization Package for Vue image

Laravel Localization Package for Vue

Read article
SaaSykit: Laravel SaaS Starter Kit logo

SaaSykit: Laravel SaaS Starter Kit

SaaSykit is a Multi-tenant Laravel SaaS Starter Kit that comes with all features required to run a modern SaaS. Payments, Beautiful Checkout, Admin Panel, User dashboard, Auth, Ready Components, Stats, Blog, Docs and more.

SaaSykit: Laravel SaaS Starter Kit
Get expert guidance in a few days with a Laravel code review logo

Get expert guidance in a few days with a Laravel code review

Expert code review! Get clear, practical feedback from two Laravel devs with 10+ years of experience helping teams build better apps.

Get expert guidance in a few days with a Laravel code review
Kirschbaum logo

Kirschbaum

Providing innovation and stability to ensure your web application succeeds.

Kirschbaum
Harpoon: Next generation time tracking and invoicing logo

Harpoon: Next generation time tracking and invoicing

The next generation time-tracking and billing software that helps your agency plan and forecast a profitable future.

Harpoon: Next generation time tracking and invoicing
Laravel Cloud logo

Laravel Cloud

Easily create and manage your servers and deploy your Laravel applications in seconds.

Laravel Cloud
Lucky Media logo

Lucky Media

Get Lucky Now - the ideal choice for Laravel Development, with over a decade of experience!

Lucky Media