Skip to content



While Hybridly does not have much to do with internationalization, it provides an artisan command for converting Laravel lang files to JSON files that can be consumed by vue-18n.

Note that this feature will move to a separated package at some point.

Internationalization keys

This article is a good resource regarding internationalization key management.

Usage with vue-i18n

The translation files generated by Hybridly are compatible with vue-i18n, which is the de-facto solution for translating Vue applications.

Its setup is rather trivial, but to globally benefit from TypeScript support, it needs to be configured by extending the DefineLocaleMessage interface.

The following file demonstrates how to do this:

import { createI18n } from 'vue-i18n'
import messages from '#/locales.json'

export type MessageSchema = typeof messages['en']

declare module 'vue-i18n' {
	export interface DefineLocaleMessage extends MessageSchema {}

const i18n = createI18n<[MessageSchema], 'en' | 'fr'>({
	locale: 'en',

export default i18n

This file can then be imported and registered as a Vue plugin:

import { initializeHybridly } from 'virtual:hybridly/config'
import i18n from './i18n'

	enhanceVue: (vue) => vue 


config/hybridly.php allows for a few configuration options.

return [
  // ...
  'i18n' => [
    'file_name_template' => '{locale}.json',
    'file_name' => 'locales.json',
  • file_name_template: name template for the the individual locale files.
  • file_name: name of the file that contain all translations.

Manual command usage

Running php artisan hybridly:i18n will create a .hybridly/locales.json file containing all locales.

Optionally, it is possible to extract each locale in its own file by using the --locales option.

Automatic re-generation

Note that, by default, translation files are automatically be re-generated when a change to a lang file is made. This is done by vite-plugin-run, which is automatically incuded.