Lingua

Originally based on Zora, but was hard modified.

Generate translations into JS file

This library allows you to generate your Laravel translations to your asset pipeline for use in JavaScript packages like Vue. (React coming soon)

Requirements

• Laravel: ^9.* or higher
• InertiaJS: ^1.*
• VueJS: ^3.*
• ViteJS: ^3.*

Installation

First, install the package via composer:

composer require cyberwolfstudio/lingua

The package will automatically register itself.

Next add an alias to your vite.config.js

 resolve: {
    alias: {
        ...
        'lingua-js': resolve(__dirname, 'vendor/cyberwolfstudio/lingua/dist/index.js')
    },
},

To build your Laravel translation into JS file, use:

php artisan lingua:generate

You can automate that process as you wish. But we recommend you a vite plugin called vite-plugin-run Install it using you package manager and just add this lines to your vite.config.js plugins section.

 run({
    name: "generate translations",
    run: ['php', 'artisan', 'lingua:generate'],
    pattern: ['resources/lang/**', 'lang/**'],
})

VueJS

In your resources/js/app.js and (if you use SSR) resources/js/ssr.js add imports

import { LinguaVue } from 'lingua-js'
import { Lingua } from './lingua'

and register LinguaVue plugin

...
.use(LinguaVue, {
    locale: props.initialPage.props.locale,
    Lingua
})

Add locale key into your HandleInertiaRequest::share method

[
    ...
    locale' => fn() => app()->getLocale(),
    ...
]

That's how your application will know your initial locale.

React

Coming soon

Usage

In your template tag use it in Laravel style, like

__(key: string, replacers: array)

//or

trans(key: string, replacers: array)

You can also use trans in your setup function by injecting it.

const trans = inject('trans') 

To change locale on JS side, you can use setLocale function.

const setLocale = inject('setLocale')
setLocale(locale)

This will change your current locale only on JS side, to change your app locale on PHP side — use the default method, Lingua will automatically catch it.