evo-mark/inertia-i18n

Internationalisation support for Inertia projects

v1.2.0 2024-10-25 09:58 UTC

Requires (Dev)

• orchestra/testbench: ^8.19

MIT

• Craig Riley

• i18n
• translation
• internationalisation
• locale
• language
• laravel
• localization
• internationalization
• localisation
• vue
• inertia
• vite
• vue3

README

Inertia I18n

Installation

composer require evo-mark/inertia-i18n

npm install ./vendor/evo-mark/inertia-i18n
--
pnpm add ./vendor/evo-mark/inertia-i18n

import InertiaI18n from "inertia-i18n/vite";

export default {
  plugins: [InertiaI18n()],
};

import useInertiaI18nVue from "inertia-i18n/vue";

createInertiaApp({
  setup({ el, App, props, plugin }) {
    const inertiaI18nPlugin = useInertiaI18nVue(props);
    // Optional, but you may get warnings without this
    await inertiaI18nPlugin.load();

    createSSRApp({ render: () => h(App, props) })
      .use(plugin)
      .use(inertiaI18nPlugin)
      .mount(el);
  },
});

Usage

After installation, you can use your frontend localisation package as usual:

<template>
    <div>{{ $t('messages.hello_world') }}</div>
</template>

OR

<script setup>
import { useI18n } from 'vue-i18n';

const { t } = useI18n();
const translated = computed(() => t('message.hello_world));
</script>

See the documentation for the respective frontend packages for more information:

Vue: vue-i18n