How to use Laravel Vue i18n
The goal of this package is to have the closest experience that is available with the Laravel Localization but for the frontend side.
If you prefer a video screencast you can check out this:
Lets install a brand new Laravel project with Jetstream, to have some Laravel with Vue3 Inertia Scaffolding.
Go to you code directory and run:
With all of that installed, lets run the migrations (make sure to update the
.env file with the correct database settings):
With all the Laravel instalation process complete, go ahead and install the plugin:
Now open the
resources/js/app.js file and import
Bellow, inside the
setup method you can now apply the plugin to the Vue instance:
With all of that done, now you can use the plugin with the
To try it out, open the
resources/js/Pages/Welcome.vue and use the mixin:
then, you can open the
lang/en.json file and add a new translation for that sentence:
And its done! If you reload the page you should see the translated sentence in there.
How to use
.php translation files
Now if you want to go a step further and also have the
.php translation files available on frontend, not possible out of the box since the browser can't open the
.php files, for that you can we can use the mix plugin provided by the plugin.
To set it up, open the
webpack.mix.js and require the mix plugin:
and just include the plugin, under the mix chain:
With this done, you can start using the
.php translation files on your
.vue files like this:
And thats all you need to have the plugin working with both
You can find more information on GitHub, and make sure to give it a ⭐️ star!